Forwarded from Flutter Zone | فلاتر و دارت
کتابخونه ساخت المنت های شیشه ای در فلاتر موسوم به سبک : گلَس مورفیسم
glassmorphism
Ui
Null safety
https://pub.dev/packages/glassmorphism_ui
✨✨✨✨✨✨✨✨✨✨✨✨
glassmorphism_ui: ^0.2.0
import 'package:glassmorphism_ui/glassmorphism_ui.dart';
GlassContainer(
height: 130,
blur: 3,
shadowStrength: 10,
opacity: 0.2,
width: 230,
//--code to remove border
border: Border.fromBorderSide(BorderSide.none),
borderRadius: BorderRadius.circular(10),
child: Center(
child: Text(
"Glass Container",
),
),
),
@flutteri
glassmorphism
Ui
Null safety
https://pub.dev/packages/glassmorphism_ui
✨✨✨✨✨✨✨✨✨✨✨✨
glassmorphism_ui: ^0.2.0
import 'package:glassmorphism_ui/glassmorphism_ui.dart';
GlassContainer(
height: 130,
blur: 3,
shadowStrength: 10,
opacity: 0.2,
width: 230,
//--code to remove border
border: Border.fromBorderSide(BorderSide.none),
borderRadius: BorderRadius.circular(10),
child: Center(
child: Text(
"Glass Container",
),
),
),
@flutteri
This media is not supported in your browser
VIEW IN TELEGRAM
کتابخانه اول, ساخت المنت های موسوم به سبک : نئومورفیسم
سبکی ترند شده با افزودن و تنظیم سایه ها، نوردهی، عمق ها به المنت و ایجاد جلوه های بصری واقعی تر
neumorphic
Ui
Null safety
https://pub.dev/packages/flutter_neumorphic
✨✨✨✨✨✨✨✨✨✨✨
dependencies:
flutter_neumorphic: ^3.0.3
//requires flutter > 1.13.18
import 'package:flutter_neumorphic/flutter_neumorphic.dart';
Neumorphic(
style: NeumorphicStyle(
shape: NeumorphicShape.concave,
boxShape: NeumorphicBoxShape.roundRect(BorderRadius.circular(12)),
depth: 8,
lightSource: LightSource.topLeft,
color: Colors.grey
),
child: ...
)
@flutteri
سبکی ترند شده با افزودن و تنظیم سایه ها، نوردهی، عمق ها به المنت و ایجاد جلوه های بصری واقعی تر
neumorphic
Ui
Null safety
https://pub.dev/packages/flutter_neumorphic
✨✨✨✨✨✨✨✨✨✨✨
dependencies:
flutter_neumorphic: ^3.0.3
//requires flutter > 1.13.18
import 'package:flutter_neumorphic/flutter_neumorphic.dart';
Neumorphic(
style: NeumorphicStyle(
shape: NeumorphicShape.concave,
boxShape: NeumorphicBoxShape.roundRect(BorderRadius.circular(12)),
depth: 8,
lightSource: LightSource.topLeft,
color: Colors.grey
),
child: ...
)
@flutteri
This media is not supported in your browser
VIEW IN TELEGRAM
کتابخانه شماره دو سبک نئومورفیسم
این کتابخانه ساده تر و قابل درک تر از قبلی هست..
https://pub.dev/packages/neumorphic
✨✨✨✨✨✨✨✨✨✨✨
dependencies:
neumorphic: any
import 'package:neumorphic/neumorphic.dart';
NeuTextField(
controller: _controller,
decoration: InputDecoration(
border: OutlineInputBorder(),
labelText: 'Write',
),
)
@flutteri
این کتابخانه ساده تر و قابل درک تر از قبلی هست..
https://pub.dev/packages/neumorphic
✨✨✨✨✨✨✨✨✨✨✨
dependencies:
neumorphic: any
import 'package:neumorphic/neumorphic.dart';
NeuTextField(
controller: _controller,
decoration: InputDecoration(
border: OutlineInputBorder(),
labelText: 'Write',
),
)
@flutteri
This media is not supported in your browser
VIEW IN TELEGRAM
پکیج محبوب shimmer جایگزین مناسب لودینگ
Shimmer
Ui
Null safety
https://pub.dev/packages/shimmer
✨✨✨✨✨✨✨✨✨
dependencies:
shimmer: ^2.0.0
import 'package:shimmer/shimmer.dart';
SizedBox(
width: 200.0,
height: 100.0,
child: Shimmer.fromColors(
baseColor: Colors.red,
highlightColor: Colors.yellow,
child: Text(
'Shimmer',
textAlign: TextAlign.center,
style: TextStyle(
fontSize: 40.0,
fontWeight:
FontWeight.bold,
),
),
),
);
@flutteri
Shimmer
Ui
Null safety
https://pub.dev/packages/shimmer
✨✨✨✨✨✨✨✨✨
dependencies:
shimmer: ^2.0.0
import 'package:shimmer/shimmer.dart';
SizedBox(
width: 200.0,
height: 100.0,
child: Shimmer.fromColors(
baseColor: Colors.red,
highlightColor: Colors.yellow,
child: Text(
'Shimmer',
textAlign: TextAlign.center,
style: TextStyle(
fontSize: 40.0,
fontWeight:
FontWeight.bold,
),
),
),
);
@flutteri
This media is not supported in your browser
VIEW IN TELEGRAM
پکیج افکت پشت آواتار، آیکون، ویجت عکس، :
Avatarglow
Ui
Null safety
https://pub.dev/packages/avatar_glow/install
✨✨✨✨✨✨✨✨✨✨✨✨
dependencies:
avatar_glow: ^2.0.1
import 'package:avatar_glow/avatar_glow.dart';
AvatarGlow(
endRadius: 60.0,
child: Material( // Replace this child with your own
elevation: 8.0,
shape: CircleBorder(),
child: CircleAvatar(
backgroundColor: Colors.grey[100],
child: Image.asset(
'assets/images/dart.png',
height: 50,
),
radius: 30.0,
),
),
),
@flutteri
Avatarglow
Ui
Null safety
https://pub.dev/packages/avatar_glow/install
✨✨✨✨✨✨✨✨✨✨✨✨
dependencies:
avatar_glow: ^2.0.1
import 'package:avatar_glow/avatar_glow.dart';
AvatarGlow(
endRadius: 60.0,
child: Material( // Replace this child with your own
elevation: 8.0,
shape: CircleBorder(),
child: CircleAvatar(
backgroundColor: Colors.grey[100],
child: Image.asset(
'assets/images/dart.png',
height: 50,
),
radius: 30.0,
),
),
),
@flutteri
This media is not supported in your browser
VIEW IN TELEGRAM
پکیج چارت دایره ای چند بخشی
Pie chart
Ui
Null safety
https://pub.dev/packages/pie_chart
✨✨✨✨✨✨✨✨✨✨✨
dependencies:
pie_chart: ^5.0.0
import 'package:pie_chart/pie_chart.dart';
Map<String, double> dataMap = {
"Flutter": 5,
"React": 3,
"Xamarin": 2,
"Ionic": 2,
};
PieChart(
dataMap: dataMap,
animationDuration: Duration(milliseconds: 800),
chartLegendSpacing: 32,
chartRadius: MediaQuery.of(context).size.width / 3.2,
colorList: colorList,
initialAngleInDegree: 0,
chartType: ChartType.ring,
ringStrokeWidth: 32,
centerText: "HYBRID",
legendOptions: LegendOptions(
showLegendsInRow: false,
legendPosition: LegendPosition.right,
showLegends: true,
legendShape: _BoxShape.circle,
...........
.....................
......................
@flutteri
Pie chart
Ui
Null safety
https://pub.dev/packages/pie_chart
✨✨✨✨✨✨✨✨✨✨✨
dependencies:
pie_chart: ^5.0.0
import 'package:pie_chart/pie_chart.dart';
Map<String, double> dataMap = {
"Flutter": 5,
"React": 3,
"Xamarin": 2,
"Ionic": 2,
};
PieChart(
dataMap: dataMap,
animationDuration: Duration(milliseconds: 800),
chartLegendSpacing: 32,
chartRadius: MediaQuery.of(context).size.width / 3.2,
colorList: colorList,
initialAngleInDegree: 0,
chartType: ChartType.ring,
ringStrokeWidth: 32,
centerText: "HYBRID",
legendOptions: LegendOptions(
showLegendsInRow: false,
legendPosition: LegendPosition.right,
showLegends: true,
legendShape: _BoxShape.circle,
...........
.....................
......................
@flutteri
Forwarded from MohammadAmir Mohammadi
نسخه جدید پکیج تقویم شمسی فلاتر منتشر شد.
در این نسخه cupertino datepicker که دیت پیکر iOS هست رو اضافه کردیم.
ممنون میشم در گیت هاب استار بدید و در پاب لایک کنید تا باعث دلگرمی ما باشه❤.
نسخه nullsafty با همکاری دوستان به زودی منتشر میشه.😉
Github: https://github.com/M-amir-M/persian-datetime-picker
Pub: https://pub.dev/packages/persian_datetime_picker
#datepicker #persian_datetime_picker #تقویم
در این نسخه cupertino datepicker که دیت پیکر iOS هست رو اضافه کردیم.
ممنون میشم در گیت هاب استار بدید و در پاب لایک کنید تا باعث دلگرمی ما باشه❤.
نسخه nullsafty با همکاری دوستان به زودی منتشر میشه.😉
Github: https://github.com/M-amir-M/persian-datetime-picker
Pub: https://pub.dev/packages/persian_datetime_picker
#datepicker #persian_datetime_picker #تقویم
صفحه بندی یا لود مرحله ای لیست موسوم به
Pagination
یه علاوه ویجت های پراستفاده دیگه در سایت، برسی کنید
@flutteri
https://www.kindacode.com/article/flutter-listview-pagination-load-more/
Pagination
یه علاوه ویجت های پراستفاده دیگه در سایت، برسی کنید
@flutteri
https://www.kindacode.com/article/flutter-listview-pagination-load-more/
Kindacode
Flutter: ListView Pagination (Load More) Example (updated) - KindaCode
In real-world Flutter applications, we often load dynamic data from servers or databases instead of using hardcode/dummy data as we often see in online examples.
For instance, you have an e-commerce app and need to load products...
For instance, you have an e-commerce app and need to load products...
https://programming.bangimo.com/115-%d8%b3%d8%a7%d8%ae%d8%aa-%d8%b1%d8%a7%d9%87%d9%86%d9%85%d8%a7-%d8%a8%d8%b1%d8%a7%db%8c-%d9%87%d8%b1-%d9%88%db%8c%d8%ac%d8%aa-%d8%ae%d8%a7%d8%b5-%d9%88-%d9%87%d8%a7%db%8c-%d9%84%d8%a7%db%8c%d8%aa/
@flutteri
@flutteri
بانگیمو
115- ساخت راهنما برای هر ویجت خاص و های لایت آن در فلاتر - بانگیمو
https://programming.bangimo.com/86-%d9%86%d8%ad%d9%88%d9%87-%d9%86%d9%85%d8%a7%db%8c%d8%b4-%d9%88%db%8c%d8%ac%d8%aa-%d9%87%d8%a7-%d8%a8%d9%87-%d8%a7%d8%b4%da%a9%d8%a7%d9%84-%d9%85%d8%ae%d8%aa%d9%84%d9%81-%d8%af%d8%b1-%d9%81%d9%84/
@flutteri
@flutteri
بانگیمو
86- نحوه نمایش ویجت ها به اشکال مختلف در فلاتر - بانگیمو