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

套件詳情v1.0.1

dynamicutils

用於從 Figma、XD 等工具建立響應式設計的 Flutter 套件.....

AndroidiOSWebmacOSWindowsLinux
近 30 天下載
60
喜歡數
21
Pub 分數
160

安裝套件

flutter pub add dynamicutils

套件介紹

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

DynamicUtils 是一個 Flutter 套件,旨在透過允許開發者直接從 Figma、XD 或其他設計工具建立流動且可擴展的版面來簡化響應式設計的實作。它提供實用工具,根據螢幕尺寸和裝置密度調整 UI 元素,確保在 Android、iOS、Web、macOS、Windows 和 Linux 上呈現一致的外觀。該套件支援動態縮放字體、大小和間距,非常適合在開發過程中維持設計的一致性。僅需透過 `flutter pub add dynamicutils` 進行最少設定,即可簡化從設計原型到生產就緒的響應式介面過渡。

適用情境

  • 將 Figma/XD 設計轉換為響應式 Flutter 應用
  • 使用一致的縮放創建跨平台使用者介面
  • 為不同螢幕尺寸調整版面
  • 在各種設備上保持設計準確性
  • 使用響應式組件進行快速原型設計
  • 建構可擴展的設計系統

主要特色

  • 動態字型和大小縮放
  • 跨平台響應式
  • 與現有 Flutter 專案的輕鬆整合
  • 對多個平台(Android、iOS、Web、macOS、Windows、Linux)的支援
  • 內建的版面適應工具
  • 無縫的設計到程式碼工作流程

適合對象

  • 使用Figma/XD設計的Flutter開發者
  • 優先考慮響應式UI一致性
  • 需要在各種設備上快速擴展使用者介面的專案
  • 開發多平台應用程式的開發者
  • 設計師與開發人員協作進行響應式版面
  • 適用於多樣化螢幕尺寸與密度的應用程式

使用建議

  • 需要初始配置縮放因子
  • 可能需要對複雜的嵌套佈局進行調整
  • 最適合具有統一基線網格的設計
  • 性能影響可忽略不計,但應在低階設備上進行測試
  • 不是一個完整的設計系統,而是一個用於響應式縮放的工具
  • 除了基本設置外,文件有限

原始 README

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

Dynamic Utils

Pub Version Flutter Platform

A Flutter package that provides dynamic sizing capabilities, allowing you to adapt your UI elements to different screen sizes.

Features

  • Dynamically adjust the height and width of UI elements based on the screen size.
  • Easily create responsive UIs that work well on different devices and orientations.
  • Convenient methods for adding spacing between elements.

Installation

Add the following line to your pubspec.yaml file:

dependencies:
  dynamicutils: <latest_version>

Then run flutter pub get to fetch the package.

Usage

Import the package into your Dart file:

import 'package:dynamicutils/dynamicutils.dart';

Initialize the DynamicSize class with the design screen size:

DynamicSize size = DynamicSize(849, 393);

Adjust the height and width of your UI elements:

DynamicSize size = DynamicSize(849, 393);
height = size.height(20);
width = size.width(20);
size.HeightSpace(20);
size.WidthSpace(20);

Create a new dynamic container:

dContainer(
  height: 20,
  width: 20,
);

For navigation:

pop(context);
newScreen(context, screen());
replaceScreen(context, screen());

For more advanced usage and customization options, refer to the package's API documentation.

Examples

You can find more usage examples in the example folder of this repository.

License

This project is licensed under the MIT License.

Contributing

Contributions are welcome! If you have any suggestions, bug reports, or feature requests, please open an issue or submit a pull request.

Get in touch

If you have any questions, feel free to reach out:

所屬分類

原始碼儲存庫

使用此套件的專案

暫無相關資料。