novyronst/lib/root/root_page.dart

import 'dart:ui';

import 'package:flutter/material.dart';
import 'package:novyronst/common/help/help_image.dart';
import 'package:novyronst/pages/collect/pages/collection_page.dart';
import 'package:novyronst/pages/first/pages/first_page.dart';
import 'package:novyronst/pages/my/pages/my_page.dart';
import 'package:novyronst/pages/play/pages/play_page.dart';
import 'package:novyronst/root/lib_export.dart';
import 'package:novyronst/tools/widgets/extend_widget.dart';
import 'package:novyronst/tools/widgets/novy_com_widget.dart';
import 'package:novyronst/tools/widgets/novy_keep_alive.dart';

class RootPage extends StatefulWidget {
  const RootPage({super.key});

  @override
  State<StatefulWidget> createState() {
    return _RootPageState();
  }
}

class _RootPageState extends State<RootPage> {
  final _pageController = PageController();
  int _currentIndex = 0;

  @override
  Widget build(BuildContext context) {
    final pages = [
      NovyKeepAlive(child: FirstPage()),
      NovyKeepAlive(child: PlayPage(isActive: _currentIndex == 1)),
      CollectionPage(),
      NovyKeepAlive(child: MyPage()),
    ];

    return Scaffold(
      body: Stack(
        children: [
          PageView(
            physics: const NeverScrollableScrollPhysics(),
            controller: _pageController,
            children: pages,
          ),
          Positioned(
            left: 0,
            right: 0,
            bottom: 0,
            child: SafeArea(
              top: false,
              child: AppBottomView(
                onSelectedIndex: (index) {
                  setState(() {
                    _currentIndex = index;
                  });
                  _pageController.jumpToPage(index);
                },
              ),
            ),
          ),
        ],
      ),
    );
  }
}

/// 底部tabbar
class AppBottomView extends StatefulWidget {
  const AppBottomView({super.key, required this.onSelectedIndex});

  final Function(int) onSelectedIndex;

  @override
  State<StatefulWidget> createState() {
    return _AppBottomViewState();
  }
}

class _AppBottomViewState extends State<AppBottomView> {
  final List<String> _unselectedIcons = [
    ConstImage.btHomeUnsel,
    ConstImage.btPlayUnsel,
    ConstImage.btCollectUnsel,
    ConstImage.btMineUnsel,
  ];
  final List<String> _selectedIcons = [
    ConstImage.btHomeSel,
    ConstImage.btPlaySel,
    ConstImage.btCollectSel,
    ConstImage.btMineSel,
  ];
  final List<String> _titles = ['Home', 'Play', 'Collect', 'Me'];
  int _currentIndex = 0;

  @override
  Widget build(BuildContext context) {
    const double _height = 65;
    return Container(
      height: _height,
      padding: const EdgeInsets.symmetric(horizontal: 16),
      child: Stack(
        children: [
          Opacity(
            opacity: 0.9,
            child: ImageFiltered(
              imageFilter: ImageFilter.blur(sigmaX: 1),
              child: HelpImage.asset(
                ConstImage.appBottom,
                width: AppScreen.screenWidth - 32,
                height: _height,
                fit: BoxFit.fill,
              ),
            ),
          ),

          Positioned.fill(
            child: Padding(
              padding: const EdgeInsets.symmetric(horizontal: 10),
              child: Row(
                mainAxisAlignment: MainAxisAlignment.spaceAround,
                children: List.generate(_unselectedIcons.length, (index) {
                  return _buildTabItem(
                    _titles[index],
                    index,
                    onTap: () {
                      setState(() {
                        _currentIndex = index;
                      });
                      widget.onSelectedIndex(index);
                    },
                  );
                }),
              ),
            ),
          ),
        ],
      ),
    );
  }

  _aaaa() {
    return ClipRRect(
      borderRadius: BorderRadius.circular(12),
      child: BackdropFilter(
        filter: ImageFilter.blur(sigmaX: 10, sigmaY: 10),
        child: Container(
          color: Colors.white.withOpacity(0.1),
          child: const Center(
            child: Text('毛玻璃效果', style: TextStyle(color: Colors.white)),
          ),
        ),
      ),
    );
  }

  Widget _buildTabItem(String title, int index, {required Function() onTap}) {
    String icon = _currentIndex == index
        ? _selectedIcons[index]
        : _unselectedIcons[index];
    Color tcolor = _currentIndex == index
        ? ConstColor.btGreen
        : ConstColor.btWhite;
    return Container(
      padding: const EdgeInsets.symmetric(horizontal: 10, vertical: 7),
      width: 60,
      height: 70,
      child: Column(
        children: [
          HelpImage.asset(icon, width: 32, height: 32),
          const SizedBox(height: 2),
          NovyText(title, fontSize: 11, color: tcolor),
        ],
      ),
    ).addInkWell(onTap: onTap);
  }
}