パッケージ、リポジトリ、アプリカテゴリを検索

circular_countdown のカバー
パッケージ詳細v2.1.0

circular_countdown

日、時間、秒、ポイントなど、あらゆる種類の単位に使用できる円形カウントダウンを表すパッケージです。

AndroidiOSWebmacOSWindowsLinux
30日間ダウンロード
2460
いいね数
72
Pub ポイント
150

パッケージをインストール

flutter pub add circular_countdown

パッケージ概要

公開情報に基づく選定ガイドです。参考としてご利用ください。

日、時間、分、秒、あるいはポイントのような抽象的な値を表示するのに適したカスタマイズ可能な円形カウントダウンタイマーを提供するFlutterパッケージです。スムーズなアニメーションと直感的なインターフェースを備えており、タイマー、ゲーム、タスクトラッカーなどの視覚的なカウントダウンが必要なアプリに最適です。Android、iOS、Web、macOS、Windows、Linuxなど複数のプラットフォームをサポートしています。

用途

  • ゲームタイマー
  • タスクカウントダウン
  • イベントカウントダウン
  • フィットネストラッキング
  • インタラクティブなUI要素

主な機能

  • スムーズな円形アニメーション
  • カスタマイズ可能な時間単位
  • クロスプラットフォーム対応
  • カスタマイズ可能な色とサイズ
  • Flutter ウィジェットとの簡単な統合

適している対象

  • インタラクティブなカウントダウンインターフェースを構築する開発者
  • 視覚的な時間追跡が必要なアプリ
  • ゲーム化アプリケーション
  • 教育または生産性ツール

注意事項

  • カウントダウンロジックの手動処理が必要
  • 制限された組み込みフォーマットオプション
  • 複雑なスケジューリングではなく、単純なカウントダウンのニーズに適している

元の README

関連するソースリポジトリの README 原文のスナップショットです。最新の内容はリポジトリをご覧ください。

circular_countdown

A package that represents a circular countdown that you can use for every kind of units (days, hours, seconds, points, ...).

Demo

A web demo is available here : https://mattisbrizard.github.io/circular_countdown/#/

Build Status

Getting Started

In the pubspec.yaml of your flutter project, add the following dependency:

dependencies:
  ...
  circular_countdown: ^2.1.0

In your library add the following import:

import  'package:circular_countdown/circular_countdown.dart';

Static countdown

This is the way to create a simple static countdown.

import 'package:flutter/material.dart';
...
return CircularCountdown(
	countdownTotal:  10,
	countdownRemaining:  7,
);
...

By playing with the parameters, you can change the size, the colors, the size of the gaps, the strokeWidth and more to have more complex Countdowns.

Timer countdown

If you want to have full control on the timer (start, pause, etc), please see the section Controlled countdown below.

If you want to use the CircularCountdown widget as a Time Countdown, you can use the built-in TimeCircularCountdown that wraps the timer logic for you: (see how in example)

return TimeCircularCountdown(
    unit: CountdownUnit.seconds,
    countdownTotal: 30,
    onUpdated: (unit, remainingTime) => print('Updated'),
    onFinished: () => print('Countdown finished'),
);

You can repeat the timer when ended by using the repeat bool property.

Controlled countdown

To have full control on the timer (play, pause, reset, shared between mutliple screen, etc), you can use CircularCountdown with the timer_controller library.

You can see the code in the example app.

Contribution

If you find a bug or want a feature, but don't know how to fix/implement it, please fill an issue. If you fixed a bug or implemented a feature, please send a pull request.

カテゴリー

ソースリポジトリ

このパッケージを使用しているプロジェクト