Flutter

[Flutter] ElevatedButton 배경 색상 background 넣기

유호야 2023. 2. 27. 02:12
반응형

Flutter에서 ElevatedButton에 색상 좀 넣으려 했더니 

마냥 간단하지가 않다

보다시피 Button 위젯 아래 

style: ButtonStyle() 로 시작해 그 안에 
backgroundColor: 속성을 준 후에

MaterialStateProperty.all(Colors.원하는색상)

이렇게 이어주어야 한다...

반응형
import 'package:flutter/material.dart';

void main() => runApp(MaterialApp(
      home: Home(),
    ));

class Home extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: const Text('my first app'),
        centerTitle: true,
        backgroundColor: Colors.blue[600],
      ),
      body: Center(
        child: ElevatedButton.icon(
          onPressed: () {},
          icon: const Icon(
            Icons.mail,
            color: Colors.white,
          ),
          label: const Text(''),
          style: ButtonStyle(
              backgroundColor: MaterialStateProperty.all(Colors.amber)),
        ),
      ),
      floatingActionButton: FloatingActionButton(
        onPressed: () {
          const AlertDialog(
            content: Text('This is question?'),
          );
        },
        backgroundColor: Colors.red[600],
        child: const Text('click!'),
      ),
    );
  }
}
반응형