How to add a button in Dart?

Question

Dart

Started writing a program in Flutter. I do not know where to start, I decided to start by adding a button. Please tell me how to create a button and its functionality.

floatingActionButton: FloatingActionButton(
        onPressed: _incrementCounter,
        tooltip: 'Increment',
        child: Icon(Icons.add),
      )

Answer 1

Here is an example of how to create buttons in Flutter ( Also documentation , and basic knowledge about widgets ):

import 'package:flutter/material.dart';

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

//У этого виджета имеется состояние.
class MyWidget extends StatefulWidget {
  @override
  createState() => new MyWidgetState();
}

class MyWidgetState extends State<MyWidget> {
  String text; // Наш текст для демонстрации функционала кнопки.

  @override
  initState() {
    super.initState();
    text = "test"; // Начальная инициализация кнопки.
  }

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
        body: Center(
          child: Column(
            children: [
              Text(text), // Наш текст для демонстрации функционала кнопки.

              // Flat кнопка.
              FlatButton(
                color: Colors.blue, // Цвет кнопки.
                textColor: Colors.white, // Цвет текста кнопки.
                child: Text("Flat Button"), // Текст кнопки.

                // При нажатие меняем текст (Функционал кнопки).
                onPressed: () => {
                  // При помощи установки нового состояния.
                  setState(() {
                    text = "Flat Button";
                  })
                },
              ),

              // Raised кнопка.
              RaisedButton(
                child: Text('Raised Button'),
                onPressed: () => {
                  setState(() {
                    text = "Raised Button";
                  })
                },
              ),

              // Icon кнопка.
              IconButton(
                icon: Icon(Icons.android),
                color: Colors.blue,
                onPressed: () => {
                  setState(() {
                    text = "Icon Button";
                  })
                },
              ),
            ],
          ),
        ),
      ),
    );
  }
}