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

circular_rotation のカバー
パッケージ詳細v0.0.2

circular_rotation

カスタマイズ可能なパッケージで、円形にカスタムウィジェットを配置できます。

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

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

flutter pub add circular_rotation

パッケージ概要

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

CircularRotation は、カスタマイズ可能な Flutter パッケージで、開発者がウィジェットを円形レイアウトに配置し、外観と動作を完全に制御できるようにします。動的なカスタマイズをサポートしており、ユーザーがカスタムウィジェット、回転角度、間隔、アニメーション効果を定義できます。インタラクティブな円形メニュー、ナビゲーションハブ、または視覚的に魅力的な UI コンポーネントを作成するのに最適です。このパッケージは、Android、iOS、Web、macOS、Windows、Linux などすべての主要プラットフォームで動作し、一貫したパフォーマンスとデザインを確保します。直感的な API と滑らかなアニメーションにより、洗練された円形配置を通じてユーザー体験を向上させます。

用途

  • 円形ナビゲーションメニューの作成
  • インタラクティブなウィジェットリングの設計
  • アニメーション付き円形スライダーの作成
  • ラジアル選択インターフェースの実装
  • ダッシュボードウィジェットの開発
  • 円形画像ギャラリーの表示

主な機能

  • 完全にカスタマイズ可能な円形レイアウト
  • カスタムウィジェットのサポート
  • スムーズな回転アニメーション
  • クロスプラットフォーム互換性
  • 調整可能な間隔と角度
  • pub.dev を通じた簡単な統合

適している対象

  • 独自のレイアウトを求めるUIデザイナー
  • インタラクティブなダッシュボードを開発する開発者
  • ラジアルナビゲーションを必要とするアプリ
  • 視覚的魅力に焦点を当てるプロジェクト
  • マルチプラットフォームアプリ用にFlutterを使用するチーム

注意事項

  • 多数のウィジェットがあるとパフォーマンスに影響する可能性があります
  • 最適なアニメーションの滑らかさを得るためには注意深い調整が必要です
  • 基本的な使用方法以外のドキュメントは限られている
  • 中程度のウィジェット数に最適
  • 複雑な階層構造には適していない

元の README

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

circular_rotation

circular_rotation version circular_rotation Git Stars MIT License

Circular rotation, It is fully customizable package which allow you to set custom widget in circular manner. It has provision for moving like solar system. There is customizable properties like speed of each round, round color, position of circular widget etc.

Circular Rotation

Circular Rotation

Usage

Example
CircularRotation(
    defaultCircleStrokeWidth: 0.2,
    defaultCircleStrokeColor: Colors.white,
    startAnimation: true,
    repeatAnimation: true,
    firstCircleAnimationDuration: 5000,
    secondCircleAnimationDuration: 7000,
    thirdCircleAnimationDuration: 10000,
    centerWidget: Image.asset(
        CENTER_IMAGE,
        width: 96,
        height: 96,
    ),
    firstCircleWidgets: [],
    secondCircleWidgets: [],
    thirdCircleWidgets: [],
)
Parameters
visibleFirstCircle:
  • Visibility of first circle.
  • It contains bool value.
  • true = visible,
  • false = invisible.
visibleSecondCircle:
  • Visibility of second circle.
  • It contains bool value.
  • true = visible,
  • false = invisible.
visibleThirdCircle:
  • Visibility of third circle.
  • It contains bool value.
  • true = visible,
  • false = invisible.
firstCircleRadius:
  • Displays the first circle based on radius.
  • Radius starts from center.
  • It contains the double value.
secondCircleRadius:
  • Displays the second circle based on radius.
  • Radius starts from center.
  • It contains the double value.
thirdCircleRadius:
  • Displays the third circle based on radius.
  • Radius starts from center.
  • It contains the double value.
firstCircleRadians:
  • Displays the first circle widgets based on radians calculation.
  • It contains the double value.
secondCircleRadians:
  • Displays the second circle widgets based on radians calculation.
  • It contains the double value.
thirdCircleRadians:
  • Displays the third circle widgets based on radians calculation.
  • It contains the double value.
firstCircleWidgets:
  • Displays the first circle widgets.
  • It contains the List of Widgets.
secondCircleWidgets:
  • Displays the second circle widgets.
  • It contains the List of Widgets.
thirdCircleWidgets:
  • Displays the third circle widgets.
  • It contains the List of Widgets.
centerWidget:
  • Displays the widget at center of circle.
  • It contains the Widget.
defaultCircleStrokeColor:
  • Change the all circles stroke(line) color.
  • It contains Color value.
  • Default value is Colors.black
firstCircleStrokeColor:
  • Change the first circle stroke(line) color.
  • It contains Color value.
  • Default value is Colors.black
secondCircleStrokeColor:
  • Change the second circle stroke(line) color.
  • It contains Color value.
  • Default value is Colors.black
thirdCircleStrokeColor:
  • Change the third circle stroke(line) color.
  • It contains Color value.
  • Default value is Colors.black
defaultCircleStrokeWidth:
  • Change the all circles stroke(line) width.
  • It contains double value.
  • Default value is 1.0
firstCircleStrokeWidth:
  • Change the first circle stroke(line) width.
  • It contains double value.
  • Default value is 1.0
secondCircleStrokeWidth:
  • Change the second circle stroke(line) width.
  • It contains double value.
  • Default value is 1.0
thirdCircleStrokeWidth:
  • Change the third circle stroke(line) width.
  • It contains double value.
  • Default value is 1.0
startAnimation:
  • Create the animation in Circular Rotation.
  • It contains bool value:
  • true = display the circular widgets with animation
  • false = display the circular widgets without animation
repeatAnimation:
  • Repeat the animation in Circular Rotation.
  • This parameter affects when [startAnimation] is true.
  • It contains bool value.
  • true = repeat the animation.
  • false = show animation only for one time.
defaultCircleAnimationDuration:
  • Set the animation duration in milliseconds for all circles.
  • This parameter affects when [startAnimation] is true.
  • It contains int value.
firstCircleAnimationDuration:
  • Set the animation duration in milliseconds for the first circle.
  • This parameter affects when [startAnimation] is true.
  • It contains int value.
secondCircleAnimationDuration:
  • Set the animation duration in milliseconds for the second circle.
  • This parameter affects when [startAnimation] is true.
  • It contains int value.
thirdCircleAnimationDuration:
  • Set the animation duration in milliseconds for the third circle.
  • This parameter affects when [startAnimation] is true.
  • It contains int value.
curve:
  • [Curves], a collection of common animation easing curves.
  • [CurveTween], which can be used to apply a [Curve] to an [Animation].
  • Default value is Curves.linear

Guideline for contributors

Contribution towards our repository is always welcome, we request contributors to create a pull request to the develop branch only.

Guideline to report an issue/feature request

It would be great for us if the reporter can share the below things to understand the root cause of the issue.

  • Library version
  • Code snippet
  • Logs if applicable
  • Device specification like (Manufacturer, OS version, etc)
  • Screenshot/video with steps to reproduce the issue

LICENSE!

Circular Rotation is MIT-licensed.

Let us know!

We’d be really happy if you send us links to your projects where you use our component. Just send an email to sales@mindinventory.com And do let us know if you have any questions or suggestion regarding our work.

カテゴリー

ソースリポジトリ

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

データはまだありません。