Menggunakan Scaffold Widget

by

JIka diperhatikan, design aplikasi mobile umumnya akan memiliki area app bar dengan judul pada bagian atas, serta ada bagian body untuk content.

Package material.dart menyediakan widget helper untuk kebutuhan tersebut, yaitu scaffold. Scaffold akan menyediakan basic struktur dan styling untuk aplikasi kita.

import 'package:flutter/material.dart';

void main() {
  runApp(MyApp());
}

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext ctx) {
    return MaterialApp(
      home: Scaffold(
        appBar: AppBar(
          title: Text('My Hello Flutter'),
        ),
        body: Text('HELLO FLUTTER..'),
      ),
    );
  }
}

Widget Scaffold memiliki property appBar: yang digunakan untuk menampilkan title dari aplikasi. Serta property body: yang digunakan untuk content dari program. Untuk saat ini hanya diisi widget Text saja.

appBar: AppBar(
  title: Text('My Hello Flutter'),
),
body: Text('HELLO FLUTTER..'),
),

Perhatian: @override adalah decorator yang menunjukan bahwa method build dari StatelessWidget memang ditimpa oleh code yang kita buat.

Sharing is caring:

Leave a Comment