패키지, 저장소 및 앱 카테고리 검색

패키지 상세v1.0.1

dynamicutils

Figma, XD 등에서 반응형 디자인을 만들기 위한 Flutter 패키지.....

AndroidiOSWebmacOSWindowsLinux
30일 다운로드
60
좋아요
21
Pub 점수
160

패키지 설치

flutter pub add dynamicutils

패키지 개요

공개 정보를 바탕으로 생성한 선택 가이드입니다.

DynamicUtils는 Figma, XD 또는 기타 디자인 도구에서 직접 유연하고 확장 가능한 레이아웃을 만들 수 있도록 해 주어 반응형 디자인 구현을 간소화하는 Flutter 패키지입니다. 화면 크기와 기기 밀도에 따라 UI 요소를 조정할 수 있는 유틸리티를 제공하여 Android, iOS, Web, macOS, Windows 및 Linux에서 일관된 외관을 보장합니다. 글꼴, 크기 및 여백의 동적 스케일링을 지원하여 개발 중 디자인 정확성을 유지하는 데 이상적입니다. `flutter pub add dynamicutils`를 통해 최소한의 설정으로 디자인 마크업에서 생산 준비 완료된 반응형 인터페이스로의 전환을 간편하게 만듭니다.

사용 사례

  • Figma/XD 디자인을 반응형 Flutter 앱으로 변환하기
  • 일관된 스케일링을 사용하여 크로스 플랫폼 UI 만들기
  • 다른 화면 크기에 맞춰 레이아웃 조정
  • 디바이스 간에 디자인 정확성 유지
  • 반응형 컴포넌트를 사용한 빠른 프로토타이핑
  • 확장 가능한 디자인 시스템 구축

주요 기능

  • 동적 글꼴 및 크기 조정
  • 크로스 플랫폼 반응성
  • 기존 Flutter 프로젝트와의 간편한 통합
  • 다중 플랫폼(안드로이드, 아이오스, 웹, 맥OS, 윈도우, 리눅스) 지원
  • 레이아웃 적응을 위한 내장 유틸리티
  • 무결점 디자인에서 코드로의 워크플로우

적합한 대상

  • Figma/XD 디자인과 함께 작업하는 Flutter 개발자
  • 반응형 UI 일관성 우선 고려
  • 다양한 기기에서 빠르게 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:

카테고리

소스 저장소

이 패키지를 사용하는 프로젝트

아직 데이터가 없습니다.