Container

Container

MaterialApp({ title,theme, home: Scaffold({ appBar, body: Container ( alignment, margin, padding, color, child ), }), })

açıklama

child alır. çerceve görevi görür önemli farkı margin padding ve color bulundurur.children almaz!

konum

MaterialApp({ title,theme, home: Scaffold({ appBar, body: Container (), }), })

parametreler

      Container( 
              alignment: Alignment.bottomCenter   // child öğelerin nereye hizalanacagını belirtir. örnekte en altta ortaya hizalanıyor.
              margin: EdgeInsets.only(top:10.0)   // parent widgeti(yani bir ustteki widgeti) hangi taraftan ne kadar itmeli.Örnekte üstten 10 birim kadar itiyor.
              padding: EdgeInsets.all(50.0)     // child widgeti hangi taraftan ne kadar itmeli.Örnekte her yandan eşit 50 birim kadar itiyor.
              color: Colors.red :         // arkaplan rengi.Örnekte arkaplanrengi kırmızı atanmış.    
              child: Column()  :          // bir çoçuk alır. Örnekte Column atanmış
           )

örnek uygulama

container-orn
     import 'package:flutter/material.dart';

    void main() => runApp(MyApp());

    class MyApp extends StatelessWidget {
      @override
      Widget build(BuildContext context) {
        return MaterialApp(
          home: Scaffold(
            appBar: AppBar(
              title: Text("Building layouts"),
            ),
            body: myLayoutWidget(),
          ),
        );
      }
    }

    Widget myLayoutWidget() {
      return Container(
        margin: EdgeInsets.all(30.0),
        padding: EdgeInsets.all(10.0),
        alignment: Alignment.topCenter,
        width: 200,
        height: 100,
        decoration: BoxDecoration(
          color: Colors.green,
          border: Border.all(),
        ),
        child: Text("Hello", style: TextStyle(fontSize: 30)),
      );
    }

Bir cevap yazın

KAPAT
%d blogcu bunu beğendi: