CodePudding user response：

In your stateful widget initialize this

List<String>? myList = List<String>(3);
 myList[0] = 'Healthy';
 myList[1] = 'Technology';
 myList[2] = 'Finance';
 
int _tappedIndex = -1;

set _tappedIndex = 0, in initState

@override
void initState() {
  super.initState();
 _tappedIndex = 0;
}

in your build widget add this

ListView.builder(
  scrollDirection: Axis.horizontal,
  itemCount: myList?.length,
  itemBuilder: (context, index) {
    return Container(
        margin: EdgeInsets.only(right: 10.0),
        decoration: BoxDecoration(
          color: _tappedIndex == index
              ? Colors.red
              : Colors.white,
          border: Border.all(
              color: Colors
                  .white),
          borderRadius:
              BorderRadius.circular(40.0),
        ),
        width: .5 *
            MediaQuery.of(context).size.width,
        child: InkWell(
          onTap: () {
            setState(() {
              _tappedIndex = index;
            });
          },
          child: 
              Expanded(
                flex: 5,
                child: Center(
                  child: Text(
                    myList![index],
                    style: TextStyle(
                      fontSize: 24,
                      color: _tappedIndex ==
                              index
                          ? Colors.white
                          : Colors.primary,
                    ),
                  ),
                ),
              ),
            ],
          ),
        ));
  },
);

CodePudding user response：

Row(
            children: [
              //unselected Chip
              ActionChip(
                onPressed: (){

                },
                shape: StadiumBorder(side: BorderSide()),
                label: Text("History"),
                backgroundColor: Colors.white,
              ),
              //selected Chip
              ActionChip(
                onPressed: (){

                },
                label: Text("Funny Stories"),
                shape: StadiumBorder(side: BorderSide(color: Colors.orange)),
                backgroundColor: Colors.orange,
              )
            ],
          ),

output :