Flutter Basics Flashcards
Material app
root app that’s required by most other widgets
scaffold
screen layout widget that adds base styling and more
What do you do with widgets?
Combine multiple widgets to build UI
const is used
will not create a second saved value if that widget is used again - lets dart reuse values and avoid duplication in memory to improve performance
Don’t need to remember when to add cons
the code editor will show blue squiggle lines to tell you to use const
To get a phrase to display on the app like “Hello World you need types
String and Object
To get a number to display as a number you need types:
int, num, and Object
Colors lets you
access predefined colors ex. backgroundColor: Colors.deepPurple,
Color lets you
set RGB values for the color ex. backgroundColor: Color.fromARGB(255,47,5,120),
main function
will be executed automatically by dart when app is opened on a device
need 2 core widgets to get UI working:
MaterialApp and home
child: Center(
//says what will show
child: Text(‘Hello World!’)
),
says where to put the code in the scaffolding
color gradients is listed in an
array
how to get custom gradient locations
begin: Alignment.topLeft,
end: Alignment.bottomRight,
can also do Alignment(x,y) and add the coordinates
text style formatting
Text(‘Hello World!’, style: TextStyle(
color: Colors.white,
fontSize: 28.0,
) )//TextStyle //Text
How to name classes
Should use camel case
Should describe what the class is about
class format
class GradientContainer extends StatelessWidget {
@override
Widget build(context) {
return “Hello World”,
}
}
classes can be stored
on same file or different file. different file needs to be imported
new file name should be formatted…
all lower case and words separated by underscore ex. gradient_container
cntrl + space
gives suggestions on vscode
variable name format
starts with lower case ex. startAlignment
if variable value does not change
use final instead of var to initiate it
lists in dart can always be
edited
format for an image widget
child:Image.asset(‘assets/image/dice-2.png’, width: 200,),
(if image is imported in .yaml folder)
Stateful widget
allow us to manage state (data that may change) inside of them
initState():Executed by Flutter when the StatefulWidget’s State object is
initialized
build():Executed by Flutter when the Widget
is built for thefirst timeANDaftersetState()was called
