Flemme는 가벼운 초기 마테리얼 접근 방식을 통해 위젯 생성을 단순화하는 Flutter 패키지입니다. 반복 코드를 줄이고 일반적인 위젯 패턴을 간소화함으로써 생산성을 향상시킵니다. 단순성에 초점을 맞춰 설계되었으며, Android, iOS, Web, macOS, Windows, Linux 등 여러 플랫폼을 지원하여 깔끔하고 효율적인 사용자 인터페이스 구축을 원하는 개발자에게 이상적입니다. 기존의 Flutter 프로젝트에 쉽게 통합되며, 더 직관적인 코딩 경험을 제공합니다.
사용 사례
빠른 UI 프로토타이핑
반복적인 위젯 코드 줄이기
재료 디자인 구현 간소화
크로스 플랫폼 UI 개발
복잡한 위젯 트리 간소화
개발자 생산성 향상
주요 기능
최소한의 보일러플레이트
초기 소재 설계 원칙
크로스 플랫폼 호환성
직관적인 API
경량 피트프린트
Flutter와의 간편한 통합
적합한 대상
Flutter 초보자
효율을 추구하는 경력 있는 개발자
빠른 개발에 집중하는 팀
일관된 UI 패턴이 필요한 프로젝트
매우 많이 사용하는 마테리얼 디자인 개발자
다중 플랫폼을 대상으로 하는 앱
고려 사항
사용 가능한 문서가 제한되어 있습니다
새로운 규칙을 배워야 할 수 있습니다
간단한부터 중간 정도로 복잡한 UI에 적합
매우 사용자 정의된 위젯 아키텍처에는 적합하지 않음
장기적인 지원을 위해서는 커뮤니티의 채택에 의존합니다
새 사용자를 위한 학습 곡선 가능성
원본 README
연결된 소스 저장소의 README 원문 스냅샷입니다. 최신 내용은 저장소에서 확인하세요.
flemme
Flutter , Light , Early, Making, Material, Environnement
Simplify the writing of your widgets with Flemme
Installation
Add flemme as a dependency in your pubspec.yaml file.
dependencies:flemme:^0.1.0
Get Started
For use Flemme object by following steps :
import'package:flemme/flemme.dart';
Defaut code Flutter Example:
ScaffolddefaultFlutterScaffoldExample() {
returnScaffold(
appBar: AppBar(
title: Text(widget.title),
),
body: Center(
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
children: <Widget>[
constText(
'You have pushed the button this many times:',
),
Text(
'$_counter',
style: Theme.of(context).textTheme.headline4,
),
],
),
),
floatingActionButton: FloatingActionButton(
onPressed: _incrementCounter,
tooltip: 'Increment',
child: constIcon(Icons.add),
), // This trailing comma makes auto-formatting nicer for build methods.
);
}
Same with Flemme:
ScaffoldflemmeScaffoldExample() {
returnScaffold(
appBar: AppBar(
title: widget.title.toTextWidget(),
),
body: [
'You have pushed the button this many times:'.toTextWidget(),
'$_counter'.toTextWidget(style: Theme.of(context).textTheme.headline4),
].listToColumn(mainAxisAlignment: MainAxisAlignment.center).withCenter(),
floatingActionButton: FloatingActionButton(
onPressed: _incrementCounter,
tooltip: 'Increment',
child: constIcon(Icons.add),
), // This trailing comma makes auto-formatting nicer for build methods.
);
}
For all Widget
Create and custom Padding
// default value : EdgeInsets.all(8.0)Padding myPadding = Text('sample').withPadding();
// you can custome like : Padding myPadding = Text('sample').withPadding(padding: EdgeInsets.all(20.0));
//context is necessaryContainer().showHimself(context);
// custom background color, default transparent:Container().showHimself(context, bgColor:Colors.red);
For String
//ellips text with '...' defaut value lenght 140String textShort = 'text too long'.ellipse();
//custom lenght: String textShort = 'text too long'.ellipse(lenght:32);
//Convert quickly String to Text WidgetText myText = 'my sample'.toTextWidget();
// you can custom with every Text parameter
For DateTime
//convert DateTime to short string //String like 10 seconds ago, a minute ago, 7 hours ago, etc. if is before now//String like in 10 seconds , in a minute, in 7 hours, etc. if is after nowString time = DateTime().returnDateSmall();
For List
List<Widget> myList = ['sample'.toTextWidget(),'sample'.toTextWidget(),'sample'.toTextWidget(),'sample'.toTextWidget()];
//Convert list to RowRow myRow = myList.listToRow();
//Convert list to ColumnColumn myRow = myList.listToColumn();
Configure and use default padding
You can use and config default padding.
Call FlemmeConfig() for use and config. It's a single instance, you don't need to put it statically in your code, just call it where you need it. Preferably before your MaterialApp