Flutter 的 CupertinoSlidingSegmentedControl 的设计问题？

问题描述

第一张图片是我想要制作的，但使用 Flutter CupertinoSlidingSegmentedControl 不允许添加边框半径。 第二张图是我目前所做的。

我想为我的 CupertinoSlidingSegmentedControl 选项添加边框半径。 目标是使它看起来像标签，但具有滑动效果。 我试过用 Flutter Tabbar 制作它，但标签栏没有任何滑动效果。现在 CupertinoSlidingSegmentedControl 没有边框属性。 我在这里添加我的代码。

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

       void main() {
       runApp(MyApp());
      }

       class MyApp extends StatelessWidget {
       @override
       Widget build(BuildContext context) {
       return MaterialApp(home: SegmentedControl());
       }
       }

     class SegmentedControl extends StatefulWidget {
      @override
        _SegmentedControlState createState() => _SegmentedControlState();
       }

       class _SegmentedControlState extends State<SegmentedControl> {
         int segmentedControlGroupValue = 0;


      final Map<int,Widget> myTabs = const <int,Widget>{
        0: Text( "Services",style: TextStyle(
        color: Colors.tealAccent,fontWeight: FontWeight.normal,fontSize: 20),),1: Text( "E-commerce",style: TextStyle(color: 
             Colors.tealAccent,fontSize: 20,};

      @override
      Widget build(BuildContext context) {
      return Scaffold(
      endDrawerEnableOpenDragGesture: false,// This way it will not open
      drawer: Drawer(),appBar: AppBar(
      title: Container(
      alignment: Alignment.center,padding: EdgeInsets.all(5),child: CupertinoSlidingSegmentedControl(
        thumbColor: Colors.teal,padding: EdgeInsets.only(
          left: 8,right: 8,top: 5,bottom: 5,backgroundColor: Colors.white,children: myTabs,groupValue: segmentedControlGroupValue,onValueChanged: (i) {
          setState(() {
            segmentedControlGroupValue = i;
          });
         // segmentedControlGroupValue == 0;
        },);

} }

解决方法

试试这个custom_sliding_segmented_control：

CustomSlidingSegmentedControl<int>(
              children: {
                0: Text('Services'),1: Text('E-Commerce'),},duration: Duration(milliseconds: 200),radius: 30.0,onValueChanged: (index) {
                print(index);
              },),