Как сделать это меню кликабельным по одному или перейти на другую страницу?

#flutter #dart

Вопрос:

Когда я нажимаю меню посещаемости, появляется страница посещаемости и то же самое для другого меню

Что я должен сделать ?

Как заставить меню щелкать одно за другим, чтобы я мог перейти на другую страницу?

 import 'package:flutter/material.dart';
import 'package:flutter_svg/flutter_svg.dart';

import '../../../size_config.dart';

class Categories extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    List<Map<String, dynamic>> categories = [
      {"icon": "assets/icons/Flash Icon.svg", "text": "Absensi"},
      {"icon": "assets/icons/Bill Icon.svg", "text": "Ijin"},
      {"icon": "assets/icons/Game Icon.svg", "text": "kalender"},
      {"icon": "assets/icons/Gift Icon.svg", "text": "Scanner"},
    ];
    return Padding(
      padding: EdgeInsets.all(getProportionateScreenWidth(20)),
      child: Row(
        mainAxisAlignment: MainAxisAlignment.spaceBetween,
        crossAxisAlignment: CrossAxisAlignment.start,
        children: List.generate(
          categories.length,
          (index) => CategoryCard(
            icon: categories[index]["icon"],
            text: categories[index]["text"],
            press: () {},
          ),
        ),
      ),
    );
  }
}

class CategoryCard extends StatelessWidget {
  const CategoryCard({
    Key key,
    @required this.icon,
    @required this.text,
    @required this.press,
  }) : super(key: key);

  final String icon, text;
  final GestureTapCallback press;

  @override
  Widget build(BuildContext context) {
    return GestureDetector(
      onTap: press,
      child: SizedBox(
        width: getProportionateScreenWidth(55),
        child: Column(
          children: [
            Container(
              padding: EdgeInsets.all(getProportionateScreenWidth(15)),
              height: getProportionateScreenWidth(55),
              width: getProportionateScreenWidth(55),
              decoration: BoxDecoration(

            

color: Color(0xFFFFECDF),
                borderRadius: BorderRadius.circular(10),
              ),
              child: SvgPicture.asset(icon),
            ),
            SizedBox(height: 5),
            Text(
              text,
              textAlign: TextAlign.center,
              style: TextStyle(
                fontSize: 12,
              ),
            )
          ],
        ),
      ),
    );
  }
}
 

например, когда вы нажимаете меню посещаемости, оно переходит на страницу посещаемости
, а также в другие меню

изображение

Может ли кто-нибудь помочь мне решить эту проблему?

исходный код

Ответ №1:

Попробуйте с условием if; в противном случае вы перейдете к инструкции switch

 press: () {
if(index==0){
 Navigator.push(
    context,
    MaterialPageRoute(builder: (context) => FirstRoute()),
  );
}

if(index==1){
 Navigator.push(
    context,
    MaterialPageRoute(builder: (context) => SecondRoute()),
  );
}
.....................
},