custom_tabs.dart

Go to the documentation of this file.

import 'package:flutter/material.dart';
import 'package:flutter_screenutil/flutter_screenutil.dart';
 
class CustomTabsBuilder extends StatelessWidget implements PreferredSizeWidget {
  const CustomTabsBuilder({
    super.key,
    required this.selctedIndex,
    required this.tabs,
    required this.onTapSelected,
  });
 
  final int selctedIndex;
  final List<String> tabs;
  final Function(int index) onTapSelected;
 
  @override
  Widget build(BuildContext context) {
    return Row(
      mainAxisAlignment: MainAxisAlignment.spaceAround,
      children: tabs.asMap().entries.map((entry) {
        return Expanded(
          child: ElevatedButton(
            onPressed: () => onTapSelected(entry.key),
            style: OutlinedButton.styleFrom(
              padding: EdgeInsets.only(top: 12.sp),
              backgroundColor: Theme.of(context).scaffoldBackgroundColor,
              shape: const RoundedRectangleBorder(
                borderRadius: BorderRadius.zero,
              ),
            ),
            child: Column(
              mainAxisSize: MainAxisSize.min,
              children: [
                Column(
                  children: [
                    Text(
                      entry.value,
                      style: Theme.of(context).textTheme.bodySmall,
                    ),
                    SizedBox(height: 10.sp),
                    Divider(
                      height: 0.0,
                      thickness: 1,
                      color: selctedIndex == entry.key
                          ? Theme.of(context).colorScheme.primary
                          : Colors.transparent,
                    )
                  ],
                ),
              ],
            ),
          ),
        );
      }).toList(),
    );
  }
 
  @override
  Size get preferredSize => Size.fromHeight(50.sp);
}