skip to Main Content

I am developing an app in flutter and have a simple question – I basically want to disable swiping to the + tab. ChatGPT is useless and I have no clue how to do it. Thank you so much in advance! Here is my code:

import 'package:flutter/material.dart';

class workout_page extends StatefulWidget {
  @override
  _WorkoutPageState createState() => _WorkoutPageState();
}

class _WorkoutPageState extends State<workout_page>
    with TickerProviderStateMixin {
  late TabController _tabController;
  List<Map<String, dynamic>> workoutMap = [
    {
      'name': 'My First Workout',
      'exercises': [
        {
          'name': 'Bicep Curl',
          'musclesworked': ['bicep', 'tricep']
        },
        {
          'name': 'Preacher Curl',
          'musclesworked': ['bicep', 'tricep']
        }
      ]
    },
  ];

  @override
  void initState() {
    super.initState();
    _tabController = TabController(length: workoutMap.length + 1, vsync: this);
  }

  TextEditingController _newTabController = TextEditingController();

  void _addTab() {
    setState(() {
      String newTabName = _newTabController.text;
      Map<String, dynamic> newTab = {
        'name': newTabName,
        'exercises': [],
      };
      workoutMap.add(newTab);
      _newTabController.clear();
      _tabController = TabController(
        length: workoutMap.length + (workoutMap.length < 4 ? 1 : 0),
        vsync: this,
      );
    });
  }

  @override
  Widget build(BuildContext context) {
    Size size = MediaQuery.of(context).size;
    return DefaultTabController(
      length: workoutMap.length + (workoutMap.length < 4 ? 1 : 0),
      child: Scaffold(
        backgroundColor: Color.fromRGBO(79, 79, 79, 1),
        appBar: PreferredSize(
          preferredSize: Size.fromHeight(60),
          child: AppBar(
            backgroundColor: Color.fromARGB(255, 19, 19, 19),
            centerTitle: false,
            flexibleSpace: Column(
              children: [
                SizedBox(height: size.height * .061),
                TabBar(
                  controller: _tabController,
                  tabs: [
                    ...workoutMap
                        .map((tab) => Tab(text: tab['name'] as String)),
                    if (workoutMap.length < 4)
                      Container(
                        width: 40,
                        height: 40,
                        alignment: Alignment.center,
                        child: IconButton(
                          icon: Icon(Icons.add),
                          onPressed: () {
                            showDialog(
                              context: context,
                              builder: (context) => AlertDialog(
                                title: Text('Add Tab'),
                                content: TextField(
                                  controller: _newTabController,
                                  decoration: InputDecoration(
                                    hintText: 'Enter tab name',
                                  ),
                                ),
                                actions: [
                                  TextButton(
                                    child: Text('Cancel'),
                                    onPressed: () {
                                      Navigator.pop(context);
                                    },
                                  ),
                                  TextButton(
                                    child: Text('Add'),
                                    onPressed: () {
                                      _addTab();
                                      Navigator.pop(context);
                                    },
                                  ),
                                ],
                              ),
                            );
                          },
                        ),
                      ),
                  ],
                ),
              ],
            ),
          ),
        ),
        body: TabBarView(
          controller: _tabController,
          children: [
            ...workoutMap.map((tab) => Column(
                  children: [
                    Text(tab['name'] as String),
                  ],
                )),
            if (workoutMap.length < 4) Container(),
          ],
        ),
      ),
    );
  }
}

PS: I have to add this in order to get this post out there – thank you so much once again!

2

Answers


  1. Give "physics" to TabBar and TabBarView.

    TabBar(
           physics: const NeverScrollableScrollPhysics(),
           controller: _tabController,
           .
           .
           .
    ),
    
    TabBarView(
               controller: _tabController,
               physics: const NeverScrollableScrollPhysics(),
               children: [
      ]
    )
    
    Login or Signup to reply.
  2. You need to physics indication to your widget. Where you don’t want swipe feature to appear. add

    physics: NeverScrollableScrollPhysics()
    

    This will fix your issue.

    Login or Signup to reply.
Please signup or login to give your own answer.
Back To Top
Search