Wrap Edit Button Last Move In Flutter

Wrap Edit Button Last Move In Flutter :

Wrap Edit Button In Flutter :In this flutter tutorial i will show you how to wrap edit button in flutter.in this flutter tutorial i will provide you the code of wrap edit button in flutter

when you want to show multiple layout vertically or horizontally so you can use the row or column

Row(
  children: [
    MyWidget(),
    MyWidget(),
    MyWidget(),
    MyWidget(),
  ],
),

if there is no space availablei n the screen multiple widget so you get the yelow and black overflow widgets warning.to fix this issue you can use the wrap widget of flutter

Wrap(
  children: [
    MyWidget(),
    MyWidget(),
    MyWidget(),
    MyWidget(),
    MyWidget(),
  ],
),

The default is to wrap horizontally in rows, but if you want to wrap vertically, you can set the direction

Wrap(
  direction: Axis.vertical,
  children: [
    MyWidget(),
    MyWidget(),
    MyWidget(),
    MyWidget(),
    MyWidget(),
  ],
),

you can also set the spacing and alignment between the widgets

the spacing is add space before the next widget and runSpacing is add the space between row and column

for more information study the following example

the result of wrap edit button in flutter is given below

Screenshot :

Wrap edit button last move.dart

import 'package:flutter/material.dart';

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

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Wrap',
      theme: ThemeData.dark(),
      home: WrapApp(),
    );
  }
}

class WrapApp extends StatefulWidget {
  @override
  _WrapAppState createState() => _WrapAppState();
}

class _WrapAppState extends State<WrapApp> {
  List<Widget> list;

  @override
  void initState() {
    list = List<Widget>()..add(_addButton());
    super.initState();
  }

  @override
  Widget build(BuildContext context) {
    final width = MediaQuery.of(context).size.width;
    final height = MediaQuery.of(context).size.height;

    return Scaffold(
        appBar: AppBar(title: Text('Wrap')),
        body: Center(
            child: Opacity(
                opacity: 0.8,
                child: Container(
                    width: width,
                    height: height / 2,
                    color: Colors.grey,
                    child: Wrap(children: list, spacing: 26.0)))));
  }

  Widget _addButton() {
    return GestureDetector(
        onTap: () {
          if (list.length < 9) {
            setState(() {
              list.insert(list.length - 1, _buildPhoto());
            });
          }
        },
        child: Padding(
            padding: EdgeInsets.all(8.0),
            child: Container(
                width: 70.0,
                height: 70.0,
                color: Colors.black54,
                child: Icon(Icons.add))));
  }

  Widget _buildPhoto() {
    return Padding(
        padding: const EdgeInsets.all(8.0),
        child: Container(
          width: 70.0,
          height: 70.0,
          color: Colors.amber,
          child: Text('Flutter'),
        ));
  }
}

The flutter tutorial  is a website that bring you the latest and amazing resources of code. All the languages codes are included in this website. The languages like flutter, android, java,kotlin etc.with the help of this languages any user can develop the beautiful application

For more information about Flutter. visit www.fluttertutorial.in