169 lines
5.5 KiB
Markdown
169 lines
5.5 KiB
Markdown
[](https://www.buymeacoffee.com/rodydavis)
|
|
[](https://www.paypal.com/cgi-bin/webscr?cmd=_s-xclick&hosted_button_id=WSH3GVC49GNNJ)
|
|
|
|
# mobile_popup
|
|
|
|
A Flutter plugin to show a PopUp Surface on Tablet / Desktop and for Mobile a Full Screen View. It will animate between them for a smooth experience. Check out the example for a demo.
|
|
|
|
## Usage
|
|
|
|
``` dart
|
|
showMobilePopup(
|
|
context: context,
|
|
builder: (context) => MobilePopUp(
|
|
title: 'App Settings',
|
|
leadingColor: Colors.white,
|
|
builder: Builder(
|
|
builder: (navigator) => Scaffold(
|
|
body: SingleChildScrollView(
|
|
child: Column(
|
|
children: <Widget>[
|
|
ListTile(
|
|
leading: Icon(Icons.brightness_auto),
|
|
title: Text('Brightness'),
|
|
trailing: Switch.adaptive(
|
|
value: true,
|
|
onChanged: (value) {},
|
|
),
|
|
),
|
|
ListTile(
|
|
leading: Icon(Icons.fingerprint),
|
|
title: Text('Fingerprint'),
|
|
trailing: Switch.adaptive(
|
|
value: false,
|
|
onChanged: (value) {},
|
|
),
|
|
),
|
|
ListTile(
|
|
leading: Icon(Icons.map),
|
|
title: Text('Navigation'),
|
|
trailing: Switch.adaptive(
|
|
value: true,
|
|
onChanged: (value) {},
|
|
),
|
|
),
|
|
],
|
|
),
|
|
),
|
|
),
|
|
),
|
|
),
|
|
);
|
|
```
|
|
|
|
## Screenshots
|
|
|
|

|
|

|
|

|
|
|
|
## Example
|
|
|
|
``` dart
|
|
import 'dart:io';
|
|
|
|
import 'package:flutter/material.dart';
|
|
|
|
import 'package:flutter/foundation.dart'
|
|
show debugDefaultTargetPlatformOverride;
|
|
import 'package:mobile_popup/mobile_popup.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 StatefulWidget {
|
|
@override
|
|
_MyAppState createState() => _MyAppState();
|
|
}
|
|
|
|
class _MyAppState extends State<MyApp> {
|
|
@override
|
|
Widget build(BuildContext context) {
|
|
return MaterialApp(
|
|
home: HomeScreen(),
|
|
);
|
|
}
|
|
}
|
|
|
|
class HomeScreen extends StatelessWidget {
|
|
const HomeScreen({
|
|
Key key,
|
|
}) : super(key: key);
|
|
|
|
@override
|
|
Widget build(BuildContext context) {
|
|
return Scaffold(
|
|
appBar: AppBar(
|
|
title: const Text('Popup Example'),
|
|
),
|
|
body: Center(
|
|
child: RaisedButton(
|
|
child: Text("Show Popup"),
|
|
onPressed: () {
|
|
showMobilePopup(
|
|
context: context,
|
|
builder: (context) => MobilePopUp(
|
|
title: 'App Settings',
|
|
leadingColor: Colors.white,
|
|
builder: Builder(
|
|
builder: (navigator) => Scaffold(
|
|
body: SingleChildScrollView(
|
|
child: Column(
|
|
children: <Widget>[
|
|
ListTile(
|
|
leading: Icon(Icons.brightness_auto),
|
|
title: Text('Brightness'),
|
|
trailing: Switch.adaptive(
|
|
value: true,
|
|
onChanged: (value) {},
|
|
),
|
|
),
|
|
ListTile(
|
|
leading: Icon(Icons.fingerprint),
|
|
title: Text('Fingerprint'),
|
|
trailing: Switch.adaptive(
|
|
value: false,
|
|
onChanged: (value) {},
|
|
),
|
|
),
|
|
ListTile(
|
|
leading: Icon(Icons.map),
|
|
title: Text('Navigation'),
|
|
trailing: Switch.adaptive(
|
|
value: true,
|
|
onChanged: (value) {},
|
|
),
|
|
),
|
|
],
|
|
),
|
|
),
|
|
),
|
|
),
|
|
),
|
|
);
|
|
},
|
|
),
|
|
),
|
|
);
|
|
}
|
|
}
|
|
|
|
```
|