【Flutter】主要6ボタンウィジェット（Elevated、Text、Outlined、Icon、Floating、Dropdown）の徹底解説

ElevatedButton(
  onPressed: () {
    // ボタンをタップした時のアクション
  },
  child: Text('Elevated Button'),
)

TextButton(
  onPressed: () {
    // アクション
  },
  child: Text('Text Button'),
)

import 'package:flutter/material.dart';

void main() => runApp(MaterialApp(home: Scaffold(body: MyOutlinedButton())));

class MyOutlinedButton extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Center(
      child: OutlinedButton(
        onPressed: () => print('OutlinedButton pressed'),
        child: Text('Tap Me'),
        style: OutlinedButton.styleFrom(
          primary: Colors.blue,
          side: BorderSide(color: Colors.blue),
        ),
      ),
    );
  }
}

import 'package:flutter/material.dart';

void main() => runApp(MaterialApp(home: Scaffold(body: MyIconButton())));

class MyIconButton extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Center(
      child: IconButton(
        icon: Icon(Icons.alarm),
        onPressed: () => print('IconButton pressed'),
      ),
    );
  }
}

import 'package:flutter/material.dart';

void main() => runApp(MaterialApp(home: Scaffold(floatingActionButton: MyFloatingActionButton())));

class MyFloatingActionButton extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return FloatingActionButton(
      onPressed: () => print('Floating Action Button pressed'),
      child: Icon(Icons.add),
      backgroundColor: Colors.green,
    );
  }
}

import 'package:flutter/material.dart';

void main() => runApp(MaterialApp(home: Scaffold(body: MyDropdown())));

class MyDropdown extends StatefulWidget {
  @override
  _MyDropdownState createState() => _MyDropdownState();
}

class _MyDropdownState extends State<MyDropdown> {
  String _selected = 'りんご';
  @override
  Widget build(BuildContext context) {
    return Center(
      child: DropdownButton<String>(
        value: _selected,
        onChanged: (value) => setState(() => _selected = value!),
        items: <String>['りんご', 'みかん', 'ぶどう'].map((String value) {
          return DropdownMenuItem<String>(value: value, child: Text(value));
        }).toList(),
      ),
    );
  }
}