Repository: flutter
Issue: [TabBar] Allow selected tab to be always in the center 
Labels: c: new feature,framework,f: material design,a: quality,team-design,triaged-design

When I used the TabBar component to build my application, I found that the selected `Tab` was not centered.

## Steps to Reproduce

<details>
  <summary>Demo</summary>

```
import 'package:flutter/material.dart';
import 'package:flutter/rendering.dart';
import 'package:flutter/services.dart';

void main() => runApp(HomePage());

class HomePage extends StatefulWidget {
  @override
  State<StatefulWidget> createState() => _HomePageState();
}

class _HomePageState extends State<HomePage> with TickerProviderStateMixin {
  TabController? _tabController;

  static List<Widget> _tabs = [
    Tab(text: "subscribe"),
    Tab(text: "movie"),
    Tab(text: "cartoon"),
    Tab(text: "documentary"),
    Tab(text: "NBA"),
    Tab(text: "KPL"),
    Tab(text: "CBA"),
    Tab(text: "TPL"),
    Tab(text: "SVG"),
    Tab(text: "TNG"),
    Tab(text: "communication"),
    Tab(text: "discover"),
    Tab(text: "cartoon"),
  ];

  @override
  void initState() {
    super.initState();

    _tabController =
        TabController(initialIndex: 1, length: _tabs.length, vsync: this);
  }

  @override
  void dispose() {
    _tabController!.dispose();

    _tabController = null;
    super.dispose();
  }

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      theme: _defaultThemeStyle,
      home: Scaffold(
        appBar: AppBar(
          title: Theme(
            data: _defaultThemeStyle.copyWith(
              highlightColor: Colors.transparent,
              splashColor: Colors.transparent,
            ),
            child: TabBar(
              tabs: _tabs,
              controller: _tabController,
              physics: const BouncingScrollPhysics(),
              indicatorWeight: 0,
              //labelColor: Colors.black,
              indicator: const BoxDecoration(),
              isScrollable: true,
            ),
          ),
        ),
        body: const SizedBox(),
      ),
    );
  }
}

ThemeData _defaultThemeStyle = ThemeData(
  backgroundColor: ColorAttrs.lightBackgroundColor,
  scaffoldBackgroundColor: ColorAttrs.lightBackgroundColor,
  bottomNavigationBarTheme: BottomNavigationBarThemeData(
    backgroundColor: ColorAttrs.lightBackgroundColor,
    selectedItemColor: ColorAttrs.nav_selected_light_color,
    unselectedItemColor: ColorAttrs.nav_unselected_light_color,
    type: BottomNavigationBarType.fixed,
    showSelectedLabels: true,
    showUnselectedLabels: true,
    elevation: 4,
    selectedLabelStyle: TextStyle(
      fontSize: 10,
      fontWeight: FontWeight.w500,
    ),
    unselectedLabelStyle: TextStyle(
      fontSize: 10,
      fontWeight: FontWeight.w500,
    ),
  ),
  tabBarTheme: TabBarTheme(
    unselectedLabelColor: ColorAttrs.tab_unselected_light_color,
    labelColor: ColorAttrs.tab_selected_light_color,
    labelPadding: EdgeInsets.symmetric(horizontal: 9.4),
    labelStyle: TextStyle(
      fontSize: 24,
      fontWeight: FontWeight.w500,
    ),
    unselectedLabelStyle: TextStyle(
      fontSize: 14,
      fontWeight: FontWeight.w500,
    ),
  ),
  appBarTheme: AppBarTheme(
    backgroundColor: ColorAttrs.lightBackgroundColor,
    brightness: Brightness.light,
    elevation: 0.4,
    centerTitle: true,
    titleTextStyle: TextStyle(
      color: Colors.black,
    ),
    systemOverlayStyle: SystemUiOverlayStyle(
      statusBarColor: Colors.transparent,
      statusBarIconBrightness: Brightness.light,
    ),
    textTheme: TextTheme(
      bodyText1: TextAttrs.light_body,
      headline6: TextAttrs.light_headline6,
    ),
  ),
);

class ColorAttrs {
  const ColorAttrs._();
  static const Color lightBackgroundColor = Color(0xFFFEFEFE);
  static const Color darkBackgroundColor = Color(0xFF000000);

  static const tab_selected_light_color = Color(0xFFFE4C01);
  static const tab_unselected_light_color = Color(0xFF848393);
  static const nav_selected_light_color = Color(0xFFFE4C01);
  static const nav_unselected_light_color = Color(0xFF848393);

  static const tab_selected_dark_color = Color(0xFF9396A0);
  static const tab_unselected_dark_color = Color(0xFF56595F);
  static const nav_selected_dark_color = Color(0xFFFE4C01);
  static const nav_unselected_dark_color = Color(0xFF9396A0);
}

class TextAttrs {
  const TextAttrs._();

  static const TextStyle light_body = TextStyle(
    color: Colors.black,
    fontSize: 14.6,
  );

  static const TextStyle light_headline6 = TextStyle(
    color: Colors.black,
    fontSize: 15.8,
  );
}

```
</details>

1. Run `flutter create bug`.
2. Update the files as follows: ... <!-- include every file that is different from the template app! -->
3. reproduce the problem
_Step 1:_ Run my demo
_Step 2:_ Select the tab label 'NBA'

**Expected results:** <!-- what did you want to see? -->
The selected Tab 'NBA' should be centered.

**Actual results:** <!-- what did you see? -->
The selected Tab 'NBA' is not centered.

**Demo Video Show:**

https://user-images.githubusercontent.com/16234264/119970558-74525900-bfe2-11eb-81c5-5fe0df584a7b.mp4

**Other problems:**

1.  I don't want the selected `Tab` to be vertically centered, How to make it easy to set the top margin only for the selected `Tab`?
2. `TabBar` doesn't provide a ScrollController, How can I control the Tabs position?
3. I don't want to see the `TabBarView` swipe left and right when I hit `Tab`, but it allows me to manually swipe left and right,    How do I do that?

 
<details>
  <summary>Logs</summary>

<!--
     Run `flutter analyze` and attach any output of that command below.
     If there are any analysis errors, try resolving them before filing this issue.
-->
**flutter analyze**
```
Analyzing flutter_new_test...
No issues found! (ran in 1.9s)
```

<!-- Finally, paste the output of running `flutter doctor -v` here. -->
**flutter doctor -v**
```
[√] Flutter (Channel stable, 2.2.0, on Microsoft Windows [Version 10.0.17763.1817], locale zh-CN)
    • Flutter version 2.2.0 at C:\wuchaochao\flutter\tools\flutter
    • Framework revision b22742018b (13 days ago), 2021-05-14 19:12:57 -0700
    • Engine revision a9d88a4d18
    • Dart version 2.13.0
    • Pub download mirror https://pub.flutter-io.cn
    • Flutter download mirror https://storage.flutter-io.cn

[√] Android toolchain - develop for Android devices (Android SDK version 29.0.2)
    • Android SDK at C:\Users\wuchaochao\AppData\Local\Android\sdk
    • Platform android-30, build-tools 29.0.2
    • Java binary at: C:\wuchaochao\Android\Android Studio\jre\bin\java
    • Java version OpenJDK Runtime Environment (build 1.8.0_242-release-1644-b01)
    • All Android licenses accepted.

[√] Chrome - develop for the web
    • CHROME_EXECUTABLE = C:\Users\wuchaochao\AppData\Local\Chromium\Application\chrome.exe

[√] Android Studio (version 4.1.0)
    • Android Studio at C:\wuchaochao\Android\Android Studio
    • Flutter plugin can be installed from:
       https://plugins.jetbrains.com/plugin/9212-flutter
    • Dart plugin can be installed from:
       https://plugins.jetbrains.com/plugin/6351-dart
    • Java version OpenJDK Runtime Environment (build 1.8.0_242-release-1644-b01)

[√] Connected device (2 available)
    • M6 Note (mobile) • 721QADRR45FUF • android-arm64  • Android 7.1.2 (API 25)
    • Chrome (web)     • chrome        • web-javascript • unknown

• No issues found!
```

</details>