ساخت پروژه Hello World در فریموورک Flutter

تو مطلب قبلی با هم دیگه اولین پروژه Flutter خودمون و ایجاد کردیم, حالا میخوایم همون پروژه و ویرایش کنیم و خودمون کدنویسی کنیم.
دیدیم که پروژه ما یک فایل به اسم main.dart داره وارد این فایل شوید و تمام کدها را پاک کنید.

برای اجرا شدن اپلیکیشن ما تمام کدهای خودمون که مربوط به UI برنامه هست و داخل متد runApp مینویسیم و همین متد runApp هم داخل متد main قرار دارد.
import 'package:flutter/material.dart'; void main(){ runApp( ); }
خب حالا داخل متد runApp ما باید یک container تعریف کنیم. container مثل یک ظزف میمونه که ما خوراکی های خودمون و داخلش میریزیم در این جا هم ما ابتدا باید یک ظرف که همان container هست تعریف کنیم و سپس خوراکی ها که همون عناصر رابط کاربری ما یا ویجت ها هستند و داخل آن قرار دهیم.
container یک لایه کلی هست در صفحه که بستگی به خودتون داره از چه نوع لایه ای استفاده کنید ما از یک لایه ای استفاده می کنیم که تمام عناصر و در وسط صفحه قرار دهد
import 'package:flutter/material.dart'; void main(){ runApp( new Center( child:new Text( "Hello Worl", textDirection: TextDirection.ltr, style: new TextStyle(fontSize: 22.0, ), ) ) ); }
در مثال بالا ما یک container از نوع Center انتخاب کردیم یک نوشته در آن قرار دادیم. تمام عناصری که داخل container میخواهیم قرار دهیم را باید با کلمه child: مشخص کنیم.
در نهایت تعیین کردیم که متن ما چپ به راست هست و یک استایل هم به اون دادیم که اندازه متن و ۲۲ تعیین می کند.
برای عوض کردن رنگ پس زمینه میتونیم به شکل زیر عمل کنیم
import 'package:flutter/material.dart'; void main(){ runApp( new Center( color: Colors.blue, child:new Text( "Hello Worl", textDirection: TextDirection.ltr, style: new TextStyle(fontSize: 22.0, ), ) ) ); }
درباره Hesam
حسام رسولیان هستم فارغ التحصیل رشته IT و موسس وبسایت فلاتر لرن - وبسایت شخصی: AtysCode.ir
نوشته های بیشتر از Hesam2 دیدگاه
به گفتگوی ما بپیوندید و دیدگاه خود را با ما در میان بگذارید.
این کد راست به چپ نیست!
سلام متوجه منظورتون نشدم! بخش کدها برای به هم نریختن چپ به راست باید باشند.