ویجت 3 (AlertDialog در فلاتر)

خوب دوستان عزیز بریم سراغ یکی از ویجت های جذاااااب فلاتر یعنی AlertDialogاگر با این ویجت اشنایی ندارید تصویر زیر نشان دهنده کامل این ویجت است که دیالوگی را به کاربر نمایش می دهدقبل از شروع کار با ویجت کد نویسی اولیه را برای ایجاد طرح اولیه انجام میدهیمimport &quotpackage:flutter/material.dart" import 'package:flutter_widgets/const/_const.dart'; class SimpleDialogPage extends StatefulWidget { @override _DialogState createState() => _DialogState(); } class _DialogState extends State<SimpleDialogPage> { @override Widget build(BuildContext context) { return Scaffold( appBar: AppBar( title: Text(PageName.SIMPLE_DIALOG), ), body: SingleChildScrollView( ), ); } }قبل از رفتن سراغ جزئیات ویجت مان یک دست گرمی باهاش میزنیم تا ببینیم این ویجت چند مرده حلاجه :)SimpleDialog( title: Text(&quotWhat we do?&quot), children: [ Text(&quotThis is our tutorial about the SimpleDialog.&quot), ], ),و خروجیپارامتر های AlertDialog به شکل زیر استSimpleDialog({ Key key, this.title, this.titlePadding = const EdgeInsets.fromLTRB(24.0, 24.0, 24.0, 0.0), this.children, this.contentPadding = const EdgeInsets.fromLTRB(0.0, 12.0, 0.0, 16.0), this.backgroundColor, this.elevation, this.semanticLabel, this.shape, })پارامتر title که عنوان دیالوگ ماست و elavation هم که سایه ماستاما shape که برای طراحی شکل دیالوگ ما به کار میرود به کد زیر و خروجی ان دقت کنیدWidget _shapeDialog() => SimpleDialog( title: Text( &quotBe careful!&quot, textAlign: TextAlign.center, ), children: <Widget>[ Text( &quotIf you write a message, you should care about the message.&quot, textAlign: TextAlign.center, ), ], backgroundColor: BLUE_LIGHT, elevation: 4, shape: StadiumBorder( side: BorderSide( style: BorderStyle.none, ), ), );ویجت AlertDialog هم به مانند SampleDialog است با یکسری پارامتر های جدیدAlertDialog({ Key key, this.title, this.titlePadding, this.titleTextStyle, this.content, this.contentPadding = const EdgeInsets.fromLTRB(24.0, 20.0, 24.0, 24.0), this.contentTextStyle, this.actions, this.backgroundColor, this.elevation, this.semanticLabel, this.shape, })پارامتر action برای ایجاد عملکرد در دیالوگ مورد استفاده قرار می گیره به کد زیر نگاه کنیدWidget _alertDialog() => AlertDialog( title: Text( &quotHow to follow us?&quot, textAlign: TextAlign.center, ), titleTextStyle: TextStyle( color: TEXT_BLACK, fontSize: 30, fontWeight: FontWeight.w700), titlePadding: EdgeInsets.symmetric(horizontal: 30, vertical: 20), content: Text(&quot1. You should login in the facebook.\n&quot &quot2. You should search the Flutter Open.\n&quot &quot3. Then, you can follow the Flutter Open.&quot), contentPadding: EdgeInsets.symmetric(horizontal: 20, vertical: 20), contentTextStyle: TextStyle(color: TEXT_BLACK_LIGHT, fontSize: 16), actions: <Widget>[ Container( height: 40, width: 100, child: FlatButton( child: Text( &quotSure&quot, style: TextStyle(color: TEXT_BLACK_LIGHT), ), color: RED_LIGHT, onPressed: () { print(&quotHello&quot); }, ), ) ], shape: RoundedRectangleBorder( side: BorderSide( style: BorderStyle.none, ), borderRadius: BorderRadius.circular(10) ), );به همین سادگی به همین خوشمزگی.اگر مطلب براتون مفید بوده لینک ان را برای دوستانتان در شبکه های اجتماعی بفرستید تا ان ها هم بتوانند استفاده کنند و به دوستداران فلاتر روز به روز افزوده شود?روز های زیبا و جذاااااااااااااااااابی داشته باشید قلب یادتون نره :)