Flutter Basics
Essential Flutter widgets: Container, Text, Row, Column.
Main Structure
import 'package:flutter/material.dart';
void main() {
runApp(MyApp());
}
class MyApp extends StatelessWidget {
Widget build(BuildContext context) {
return MaterialApp(home: HomePage());
}
}
Text Widget
# Basic text
Text('Hello Flutter')
# Styled text
Text(
'Styled',
style: TextStyle(
fontSize: 20,
fontWeight: FontWeight.bold,
color: Colors.blue
)
)
Container
Container(
width: 100,
height: 100,
color: Colors.blue,
child: Text('Box')
)
# With padding
Container(
padding: EdgeInsets.all(16),
decoration: BoxDecoration(
borderRadius: BorderRadius.circular(10)
)
)
Row & Column
# Row - horizontal
Row(
mainAxisAlignment: MainAxisAlignment.spaceEvenly,
children: [Text('Item 1'), Text('Item 2')]
)
# Column - vertical
Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [Text('Item 1'), Text('Item 2')]
)