Флаттер: ящик становится недоступным при отправке подпредставлений с помощью Навигатора - PullRequest
0 голосов
/ 30 мая 2018

Ссылка на источник на github: https://github.com/dnn1s/flutter_navigationtest

Я хочу выполнить тот же навигационный подход, что и Google с приложением Play Store: в ящике перечислены доступные «корневые» представления (в моем случае view1на view3), в то время как любой корневой вид может иметь любое количество подпредставлений и свой собственный стек навигации.Суть в том, что даже когда пользователь находится в одном из подпредставлений, ящик все еще доступен с помощью жеста смахивания, начиная с внешнего левого края экрана и заканчивая центром - и это невозможно при моем текущем подходе.Что касается приложения Play Store, когда вы нажимаете на приложение, чтобы увидеть его детали, вы можете либо вернуться назад, нажав стрелку в верхнем левом углу, либо напрямую вызвать ящик, проведя пальцем.

main.дротик: ничего необычного

void main() => runApp(new NavigationTestApp());

class NavigationTestApp extends StatelessWidget {
    @override
    Widget build(BuildContext context) {
        return new MaterialApp(
            title: 'Navigation test',
            home: new MainPage(),
        );
    }
}

mainpage.dart: это представление включает ящик и его элементы

import 'package:flutter/material.dart';

import 'view1.dart';
import 'view2.dart';
import 'view3.dart';

/// just a wrapper class for drawer items; in my original code, these include 
/// icons and other properties
class DrawerItem {
    String title;
    DrawerItem({this.title});
}

class MainPage extends StatefulWidget {

    /// list of items in the drawer
    final drawerItems = [
        new DrawerItem(title: 'Item 1'),
        new DrawerItem(title: 'Item 2'), 
        new DrawerItem(title: 'Item 3')
    ];

    @override
    State<MainPage> createState() => new MainPageState();
}

class MainPageState extends State<MainPage> {
    int _selectedPageIndex = 0;

    @override
    Widget build(BuildContext context) {
        return new Scaffold(
            appBar: new AppBar(
                /// dynamic title, depending on the current view
                title: new Text(widget.drawerItems[_selectedPageIndex].title),
            ),
            drawer: new Drawer(
                child: new ListView(
                    padding: EdgeInsets.zero,
                    children: <Widget>[
                        new DrawerHeader(child: new Text('Drawer header')),
                        /// quick and easy way to create the items;
                        /// in the original
                        /// code, these items are built in a loop
                        _buildDrawerItem(0),
                        _buildDrawerItem(1),
                        _buildDrawerItem(2),
                    ],
                )
            ),
            body: _buildCurrentPage()
        );
    }

    Widget _buildCurrentPage() {
        switch(_selectedPageIndex) {
            case 0: return new View1();
            case 1: return new View2();
            case 2: return new View3();
        }
        return new Text('Invalid page index');
    }

    Widget _buildDrawerItem(int index) {
        return new ListTile(
            title: new Text(widget.drawerItems[index].title),
            selected: _selectedPageIndex == index,
            onTap: () => _handleSelection(index),
        );
    }

    void _handleSelection(int index) {
        setState(() {
            _selectedPageIndex = index;
        });
        /// close the drawer
        Navigator.of(context).pop();
    }

}

Это первое корневое представление:

view1.dart:

class View1 extends StatelessWidget {

    @override
    Widget build(BuildContext context) {
        return new RaisedButton(
            child: new Text('Push Subview1'),
            onPressed: () {
                Navigator.of(context).push(new MaterialPageRoute(
                    builder: (context) {
                        return new SubView1();
                    }
                ));
            },
        );
    }

}

subview1.dart:

import 'package:flutter/material.dart';

class SubView1 extends StatelessWidget {

    @override
    Widget build(BuildContext context) {
        return new Scaffold(
            appBar: new AppBar(
                title: new Text('SubView1'),
            ),
            body: new Text('Pushed from View1')
        );
    }

}

Я знаю о классах Купертино, но я предпочитаю материал дизайна.Может ли кто-нибудь указать мне правильное направление, как реализовать желаемое поведение?

1 Ответ

0 голосов
/ 30 мая 2018

Поскольку это две разные страницы, ящик на одной странице не будет доступен на другой странице.Если вы хотите, чтобы вы создали ящик на обеих страницах.Я как можно больше обернул все, что касается Drawer, в отдельный класс drawer.dart с комментариями везде, чтобы было полезно разобраться.

Plugin used

scoped_model: "^0.2.0"

mainpage.dart

import 'package:commo_drawer/drawer.dart';
import 'package:flutter/material.dart';

import 'view1.dart';
import 'view2.dart';
import 'view3.dart';

MainPageState mainPageState = new MainPageState();

class MainPage extends StatefulWidget {
  @override
  State<MainPage> createState() => mainPageState;
}

class MainPageState extends State<MainPage> {
  MyDrawer myDrawer;

  @override
  void initState() {
    myDrawer =
        new MyDrawer(shouldRebuildState: DrawerItemClick.NEED_TO_REBUILD_STATE);
    myDrawer.addListener(() {
      setState(() {});
    });
    super.initState();
  }

  rebuild() {
    setState(() {});
  }

  @override
  Widget build(BuildContext context) {
    return new Scaffold(
      appBar: new AppBar(
        title: new Text(drawerItems[myDrawer.selectedPageIndex].title),
      ),
      drawer: myDrawer.buildDrawer(context),
      body: _buildCurrentPage(),
    );
  }

  Widget _buildCurrentPage() {
    switch (myDrawer.selectedPageIndex) {
      case 0:
        return new View1();
      case 1:
        return new View2();
      case 2:
        return new View3();
    }
    return new Text('Invalid page index');
  }
}

subview1.dart

import 'package:commo_drawer/drawer.dart';
import 'package:flutter/material.dart';

class SubView1 extends StatelessWidget {
  final MyDrawer myDrawer = new MyDrawer(shouldRebuildState: DrawerItemClick.NEED_NOT_REBUILD_STATE);
  @override
  Widget build(BuildContext context) {
    return new Scaffold(
      appBar: new AppBar(
        title: new Text('SubView1'),
        leading: new IconButton(
            icon: new Icon(Icons.arrow_back),
            onPressed: () {
              Navigator.of(context).pop();
            }),
      ),
      body: new Text('Pushed from View1'),
      drawer: myDrawer.buildDrawer(context),
    );
  }
}

drawer.dart

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

int _selectedPageIndex = 0;
BuildContext _context;

class MyDrawer extends Model {
  DrawerItemClick shouldRebuildState;

  MyDrawer({this.shouldRebuildState});

  int get selectedPageIndex => _selectedPageIndex;

  Drawer buildDrawer(BuildContext context) {
    _context = context;

    return new Drawer(
      child: new ListView(
        padding: EdgeInsets.zero,
        children: <Widget>[
          new DrawerHeader(child: new Text('Drawer header')),
          buildDrawerItem(0),
          buildDrawerItem(1),
          buildDrawerItem(2),
        ],
      ),
    );
  }

  Widget buildDrawerItem(int index) {
    return new ListTile(
      title: new Text(drawerItems[index].title),
      selected: selectedPageIndex == index,
      onTap: () => _handleSelection(index),
    );
  }

  void _handleSelection(int index) {
    Navigator.of(_context).pop(); // Close drawer
    if (shouldRebuildState == DrawerItemClick.NEED_TO_REBUILD_STATE) {
      if (_selectedPageIndex != index) {
        _selectedPageIndex = index;
        notifyListeners();
      }
    } else {
      shouldRebuildState = DrawerItemClick.NEED_TO_REBUILD_STATE;
      Navigator.of(_context).pop(); // Close SubView

      if (_selectedPageIndex != index) {
        _selectedPageIndex = index;
        notifyListeners();
      }
    }

  }
}

final drawerItems = [
  new DrawerItem(title: 'Item 1'),
  new DrawerItem(title: 'Item 2'),
  new DrawerItem(title: 'Item 3'),
];

class DrawerItem {
  String title;

  DrawerItem({this.title});
}

enum DrawerItemClick { NEED_TO_REBUILD_STATE, NEED_NOT_REBUILD_STATE }
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...