Pada kali ini kita akan mempelajari sebuah switch pada flutter. Switch merupakan widget yang digunakan untuk mengubah pengaturan antara True/False. Biasanya digunakan untuk jika hanya terdapat dua keadaan kita ubah.

• Langkah yang pertama kita membuat sebuah project baru
• Buat lah sebuah state untuk kondisi TRUE / FALSE

bool _isSwitch = false;
var txtValue = 'Switch is OFF';

void toggleSwitch(bool value){

  if(_isSwitch == false){
    setState((){
      _isSwitch = true;
      txtValue = 'Switch Button is ON!';
    });
    print('Switch Button is ON!');
  }else{
    setState((){
      _isSwitch = false;
      txtValue = 'Switch Button is OFF!';
    });
    print('Switch Button is OFF!');
  }

}

• Buatlah sebuah tombol Switch pada aplikasi

Transform.scale(
  scale: 2,
  child: Switch(
    onChanged: toggleSwitch,
    value: _isSwitch,
    activeColor: Colors.blue,
    activeTrackColor: Colors.yellow,
    inactiveThumbColor: Colors.redAccent,
    inactiveTrackColor: Colors.orange,
  ),
),
Text('$txtValue', style: TextStyle(fontSize: 20),),

• Tampilan semua coding switch

import 'package:flutter/material.dart';

class HomePage extends StatefulWidget {
  const HomePage({Key? key}) : super(key: key);

  @override
  State<HomePage> createState() => _HomePageState();
}

class _HomePageState extends State<HomePage> {
  bool _isSwitch = false;
  var txtValue = 'Switch is OFF';

  void toggleSwitch(bool value){

    if(_isSwitch == false){
      setState((){
        _isSwitch = true;
        txtValue = 'Switch Button is ON!';
      });
      print('Switch Button is ON!');
    }else{
      setState((){
        _isSwitch = false;
        txtValue = 'Switch Button is OFF!';
      });
      print('Switch Button is OFF!');
    }

  }



  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text("Batch 9 Magang Udacoding"),
      ),
      body: ListView(
        children: [
            Transform.scale(
              scale: 2,
              child: Switch(
                onChanged: toggleSwitch,
                value: _isSwitch,
                activeColor: Colors.blue,
                activeTrackColor: Colors.yellow,
                inactiveThumbColor: Colors.redAccent,
                inactiveTrackColor: Colors.orange,
              ),
            ),
            Text('$txtValue', style: TextStyle(fontSize: 20),),
        ],
      ),
    );
  }
}