2021/2/28 : Flutter : Slider、RangeSlider、CupertinoSlider(Flutter 今週のウィジェット)について

//Slider,とりあえず動くサンプル
import 'package:flutter/material.dart';

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

class MyApp extends StatefulWidget {
  @override
  _MyAppState createState() => _MyAppState();
}

class _MyAppState extends State<MyApp> {
  double rating=40.0;

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body:Center(
        child:Column(
          mainAxisAlignment:MainAxisAlignment.center,
          children: [
            Text("${rating.round()}",style:TextStyle(fontSize:40.0,),),
            //↓Slider.adaptiveコンストラクタにするとiOSデバイス時に
            //Cupertinoスライダーになる。(引数はデフォルトコンストラクタと同じ模様。)
            Slider(
              value:rating,
              onChanged:(newRating){
                setState((){
                  rating=newRating;
                });
              },
              min:0,
              max:100,
              divisions:50,
              label:"${rating.round()}",
            ),
          ],
        ),
      ),
    );
  }
}

//RangeSliderとりあえず動くサンプル
import 'package:flutter/material.dart';

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

class MyApp extends StatefulWidget {
  @override
  _MyAppState createState() => _MyAppState();
}

class _MyAppState extends State<MyApp> {
  double rating=40.0;
  RangeValues selectedRange = RangeValues(0.2,0.8);

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body:Center(
        child:Column(
          mainAxisAlignment:MainAxisAlignment.center,
          children: [
            Text("${selectedRange}",style:TextStyle(fontSize:40.0,),),
            RangeSlider(
              values:selectedRange,
              onChanged:(RangeValues newRange){
                setState((){
                  selectedRange=newRange;
                });
              },
              min:0.0,
              max:2.0,
              divisions:10,
              labels:RangeLabels('${selectedRange.start}','${selectedRange.end}'),
            ),
          ],
        ),
      ),
    );
  }
}