Skip to content
Branch: master
Find file History
Latest commit 5574dd4 May 21, 2019
Permalink
Type Name Latest commit message Commit time
..
Failed to load latest commit information.
.idea Creating Mobile Sidebar plugin May 9, 2019
.vscode
example base ported May 21, 2019
lib base ported May 21, 2019
screenshots Adding support for more tab May 15, 2019
test Creating Mobile Sidebar plugin May 9, 2019
.gitignore Creating Mobile Sidebar plugin May 9, 2019
.metadata Creating Mobile Sidebar plugin May 9, 2019
CHANGELOG.md Adding support for more tab May 15, 2019
LICENSE Creating Mobile Sidebar plugin May 9, 2019
README.md Adding support for more tab May 15, 2019
mobile_sidebar.iml Creating Mobile Sidebar plugin May 9, 2019
pubspec.yaml

README.md

mobile_sidebar

A Flutter plugin to show a sidebar on tablet and desktop then a list or gridview on mobile.

Screenshots

Demo

Example

import 'dart:io';

import 'package:flutter/foundation.dart';
import 'package:flutter/material.dart';
import 'package:flutter/widgets.dart';

import 'package:mobile_sidebar/mobile_sidebar.dart';

void main() {
  _setTargetPlatformForDesktop();
  runApp(MyApp());
}

/// If the current platform is desktop, override the default platform to
/// a supported platform (iOS for macOS, Android for Linux and Windows).
/// Otherwise, do nothing.
void _setTargetPlatformForDesktop() {
  TargetPlatform targetPlatform;
  if (Platform.isMacOS) {
    targetPlatform = TargetPlatform.iOS;
  } else if (Platform.isLinux || Platform.isWindows) {
    targetPlatform = TargetPlatform.android;
  }
  if (targetPlatform != null) {
    debugDefaultTargetPlatformOverride = targetPlatform;
  }
}

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: new HomeScreen(),
    );
  }
}

class HomeScreen extends StatefulWidget {
  @override
  _HomeScreenState createState() => _HomeScreenState();
}

class _HomeScreenState extends State<HomeScreen> {
  bool _showList = false;
  final _breakpoint = 800.0;
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('Mobile Side Menu Example'),
        actions: <Widget>[
          if (MediaQuery.of(context).size.width < _breakpoint) ...[
            IconButton(
              icon: Icon(_showList ? Icons.grid_on : Icons.grid_off),
              onPressed: () {
                if (mounted)
                  setState(() {
                    _showList = !_showList;
                  });
              },
            )
          ]
        ],
      ),
      body: MobileSidebar(
        items: <MenuItem>[
          MenuItem(
            icon: Icons.edit,
            color: Colors.black,
            title: 'Manage',
            subtitle: 'Edit, Share, Delete',
            child: Container(color: Colors.blueAccent),
          ),
          MenuItem(
            icon: Icons.event,
            color: Colors.blueAccent,
            title: 'Tasks',
            subtitle: 'Personal Tasks',
            child: Container(color: Colors.purpleAccent),
          ),
          MenuItem(
            icon: Icons.timer,
            color: Colors.blueGrey,
            title: 'Log',
            subtitle: 'History of Results',
            child: Container(color: Colors.black),
          ),
          MenuItem(
            icon: Icons.star,
            color: Colors.amber,
            title: 'Favorites',
            subtitle: 'Custom List',
            child: Container(color: Colors.yellowAccent),
          ),
        ],
        showList: _showList,
        floatingActionButtonLocation: FloatingActionButtonLocation.centerFloat,
        floatingActionButton: FloatingActionButton.extended(
          backgroundColor: Colors.redAccent,
          heroTag: 'create-contact',
          label: Text('Add new item'),
          icon: Icon(Icons.add),
          onPressed: () {},
        ),
      ),
    );
  }
}
You can’t perform that action at this time.