搜尋套件、儲存庫與 APP 分類

animated_segment 封面
套件詳情v0.0.4

animated_segment

此套件為您提供一種現代化的動畫花式區段。以彈性方式動畫顯示選項卡的選擇。

AndroidiOSWebmacOSWindowsLinux
近 30 天下載
72
喜歡數
72
Pub 分數
150

安裝套件

flutter pub add animated_segment

套件介紹

根據套件公開資料產生的選型評估,僅供參考。

animated_segment 套件提供了一種現代且視覺上吸引人的分段控制項,具有彈性動畫效果,適用於標籤選擇。它透過在各個分段之間提供流暢、動態的過渡來提升使用者體驗,非常適合互動式介面。此套件輕量級,並相容於多個平台,包括 Android、iOS、Web、macOS、Windows 和 Linux。透過 Flutter pub add 進行最少設定,開發者可輕鬆將優雅、響應式的分段控制項整合至其應用程式中。

適用情境

  • 互動式標籤導航
  • 動態表單篩選
  • 可自訂的儀表板標籤
  • 使用者偏好選擇器
  • 增強的使用者介面回饋
  • 以行動裝置為首的介面設計

主要特色

  • 標籤選擇時的彈性動畫
  • 跨平台相容性
  • 與 Flutter 的簡單整合
  • 可自訂外觀
  • 平滑的過渡效果
  • 輕量且高效

適合對象

  • 尋求現代 UI 元件的 Flutter 開發人員
  • 需要吸引人的標籤互動的應用程式
  • 注重設計的應用程式
  • 響應式行動與Web介面
  • 希望使用最少程式碼實現豐富動畫的開發者

使用建議

  • 可能需要額外的樣式設定以實現複雜設計
  • 在低階設備上,當有許多區段時的效能影響
  • 僅限基本段落功能,不支援進階自訂選項
  • 不適用於非標籤頁導航模式

原始 README

以下為關聯原始碼儲存庫的 README 原文快照,最新內容請造訪原始碼儲存庫。

animated_segment

animated_segment version MIT License MIT License

This package will animates a segment. Package provides you a modern animated fancy segment. Show selection of tab using elastic way animation.

Animated Segment

Animated Segment

Usage

Example
AnimatedSegment(
  segmentNames: [Strings.tab_1, Strings.tab_2, Strings.tab_3],
  onSegmentChanged: (index) {
    print('Selected Segment Index is: $index');
  },
  backgroundColor: AppColors.bgColor,
  segmentTextColor: AppColors.white,
  rippleEffectColor: AppColors.primary,
  selectedSegmentColor: AppColors.primary,
);
Required parameters
segmentNames:

This property takes List as a parameter and segmentNames is useful to display items in segment.

onSegmentChanged:

Call back called when the user select the new segment and return the selected segment index. Index for the initial selected segment is 0.

Optional parameters
initialSegment:

This property takes int value as a parameter. This is use to set the initial segment from [segmentNames].

backgroundColor:

This property takes Color value as a parameter. You can change the background color of animated segment. default value is Color(0xff8AADFB)

segmentTextColor:

This property takes Color value as a parameter. You can change the text color of segmented text color. default value is Color(0xff0217FD)

rippleEffectColor:

This property takes Color value as a parameter. You can change the ripple color of segment. default value is Colors.white

selectedSegmentColor:

This property takes Color value as a parameter. You can change the selected segment color of animated segment. default value is Colors.white

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!

Animated Segment 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.

所屬分類

原始碼儲存庫

使用此套件的專案

暫無相關資料。