I want to use a semicircle CupertinoSlidingSegmentedControl button style,

but its shape seems to be fixed.

Is it possible to make its shape into a semicircle?

import 'package:flutter/material.dart';
import 'package:flutter/cupertino.dart';

class SlideButton extends StatefulWidget {
  final Function(int) onChanged;
  SlideButton({@required this.onChanged});

  @override
  State<StatefulWidget> createState() => _SlideButtonState();
}

class _SlideButtonState extends State<SlideButton> {
  int _index = 0;

  @override
  Widget build(BuildContext context) {
    final Map<int, Widget> myTabs = <int, Widget>{
      0: Text(
        'Discovery',
        style: TextStyle(
          fontFamily: 'AppleSDGothicNeo',
          color: _index == 0 ? Colors.white : Colors.black,
        ),
      ),
      1: Text(
        'My Page',
        style: TextStyle(
          fontFamily: 'AppleSDGothicNeo',
          color: _index == 1 ? Colors.white : Colors.black,
        ),
      ),
    };

    return CupertinoSlidingSegmentedControl(
      groupValue: _index,
      children: myTabs,
      thumbColor: Color(0xFF254690),
      onValueChanged: (i) {
        setState(() {
          _index = i;
          widget.onChanged(i);
        });
      },
    );
  }
}

Here's my code. Thanks in advance:D

CodePudding user response：

you can try this, custom_sliding_segmented_control:

        CustomSlidingSegmentedControl<int>(
          children: {
            0: Text('Новости'),
            1: Text('Карты'),
            2: Text('Список'),
          },
          duration: Duration(milliseconds: 200),
          radius: 30.0,
          onValueChanged: (index) {
            print(index);
          },
        ),