Как перейти к различным экранам после нажатия на элемент списка?

#flutter #listview

#flutter #просмотр списка

Вопрос:

Я получаю свои данные через Hive в ListView, вот мой код, в котором я показываю ListView.

 import 'package:flutter/material.dart';
import 'package:hive/hive.dart';
import 'package:hive_flutter/hive_flutter.dart';
import 'package:secret_keeper/Database/Hive/PasswordModel.dart';
import 'package:secret_keeper/screens/home_screen/passwords/ShowData.dart';

class PasswordsNavigation extends StatefulWidget {
  @override
  _PasswordsNavigationState createState() => _PasswordsNavigationState();
}

class _PasswordsNavigationState extends State<PasswordsNavigation> {

  var passwordBox = Hive.box<PasswordModel>('passwordBox');

  @override
  Widget build(BuildContext context) {
    return Scaffold(
        body: Column(
      children: [
        Expanded(
          child: _buildListView(),
        )
      ],
    ));
  }

  Widget _buildListView() {
    return WatchBoxBuilder(
      box: passwordBox,
      builder: (context, box) {
        Map<dynamic, dynamic> raw = box.toMap();
        List list = raw.values.toList();

        return ListView.builder(
          shrinkWrap: true,
          itemCount: list.length,
          itemBuilder: (context, index) {
            PasswordModel passwordModel = list[index];
            return ListTile(
              title: Text(passwordModel.websiteName),
              subtitle: Text(passwordModel.websiteAddress),
              trailing: Row(
                mainAxisSize: MainAxisSize.min,
                children: [
                  IconButton(
                    icon: Icon(Icons.delete),
                    onPressed: (){
                      passwordBox.deleteAt(index);
                    },
                  )
                ],
              ),
            );
          },
        );
      },
    );
  }
}
 

Я создал новый файл .dart с именем showData.dart, когда я нажимаю на любой элемент, как открыть это действие? Я не знаю, как перейти к новому экрану, когда я нажимаю на элемент списка, и мне нужны такие данные, как индекс списка n, все с помощью navigator.

Комментарии:

1. ListTile() Имеет метод onTap. Для навигации ознакомьтесь с flutter.dev/docs/cookbook/navigation/navigation-основы

Ответ №1:

Вероятно, вам следует создать новый виджет для страницы, например:

 class DetailsPage extends StatelessWidget {
  DetailsPage({Key key, required this.id}) : super(key: key);

  final int id;

  Widget build(BuildContext context) {
    // Show details for the item with the given id.
    ...
  }
}
 

Обратите внимание, что он также принимает id параметр в конструкторе.

Затем, в методе ListTile ‘s onTap , вы можете перейти на новую страницу, пройдя по id :

 ListTile(
  onTap: () {
    Navigator.of(context).push(MaterialPageRoute(
      builder: (_) => DetailsPage(id: /* id of the item at the current index */),
    ));
  },
  ...
),