Tags
Flutter
Asked 2 years ago
12 Oct 2021
Views 424
Mauricio

Mauricio posted

Flutter - Padding widget

how to use Padding in the Flutter ?
can i use something else instead of complete new Padding wrap to every children element , ? all element have differ padding.
web-api

web-api
answered Oct 12 '21 00:00

element widget need to wrapped with Padding widget , you can apply padding by padding artibute

Padding(
                  padding: EdgeInsets.all(16.0),
                  child: Align(
                      alignment: Alignment.topLeft,
                      child: const Text('Enter something to search')
                  )
              )
          ) 


here EdgeInsets.all(16.0) means it give padding 16 px to left , right , bottom , top

complete widget code is in use like below :

import 'package:flutter/material.dart';

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

class MyApp extends StatelessWidget {
  String _title = 'Welcome to Test';

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: _title,
      home: Scaffold(
        appBar: AppBar(
          title: Text(_title),
        ),
        body: Column(children: <Widget>[
          Container(
              child: Padding(
                  padding: EdgeInsets.all(16.0),
                  child: Align(
                      alignment: Alignment.topLeft,
                      child: const Text('Enter something to search')
                  )
              )
          ),
          Container(
            child: Padding(padding:  EdgeInsets.all(16.0), child:TextField(
              decoration: const InputDecoration(
                  border: OutlineInputBorder(),
                  hintText: 'Enter a search term'),
            ),
            )
          ),
        ]),
      ),
    );
  }
}

Post Answer