Toogle Button Issue for making android application using flutter

Question

I am making travel application but there was two screen one is FROM and second one is TO so I need two buttons like toogle with circuler shape Requirment screenshot is mention in the bellow

https://drive.google.com/file/d/1nLhrmqanxHH6tsSBpPuMz82LYPqD00QC/view?usp=drive_link

I already Explain it please give me the solution how I can make it

Answer 1

Try https://pub.dev/packages/custom_sliding_segmented_control

The widget you are looking for is called CupertinoSlidingSegmentedControl in flutter but it is not customisable enough. Someone has created above widget.

Answer 2

To achieve this you can either customize this material or you can try this package toggle_switch. in this package by using the below code you can do this

ToggleSwitch(
  minWidth: 90.0,
  cornerRadius: 20.0,
  activeBgColors: [[Colors.blue[800]!], [Colors.blue[800]!]],
  activeFgColor: Colors.white,
  inactiveBgColor: Colors.grey,
  inactiveFgColor: Colors.white,
  initialLabelIndex: 1,
  totalSwitches: 2,
  labels: ['From', 'To'],
  radiusStyle: true,
  onToggle: (index) {
    print('switched to: $index');
  },
),