Flutter Hilfen

Flutter Demo App

☕

App Titel

⋮

☰

☀

Neues Projekt anlegen: Strg + Shift + P

Aktionsmenü öffnen: Strg + Strg + .

Build Gradle Fehler (Build faild in android uses-sdk:minSdkVersion 16 cannot be smaller …) beheben:
Datei öffnen: ./android/app/build.gradle
minSdkVersion 19 auf minSdkVersion 21
ändern und speichern.

Code formatieren: alt + shift + f

Nächste Seite aufrufen:

Navigator.push(context,MaterialPageRoute(builder: (BuildContext context) => ScreenTwo()));

Seite zurück aufrufen:

Navigator.pop(context);

Scrollen aktivieren:

child: SingleChildScrollView(
.
.
.
),

Share AppBar IconButton:
1. Plugin in Pubspec.yaml eintragen

share: ^0.6.1+1

2. Plugin importieren

import ‚package:share/share.dart‘;

3. Methode in override einfügen:

void _onShareTap() {
final RenderBox box = context.findRenderObject();
Share.share('Die App musst Du unbedingt ausprobieren: https://google.de',
sharePositionOrigin: box.localToGlobal(Offset.zero) & box.size);
}

4. In die AppBar einfügen

actions: <Widget>[
IconButton(icon: Icon(Icons.share),color: Colors.red, onPressed: _onShareTap)
],

Daten aus TextField ziehen und nutzen:
Zuerst einen Controller anlegen.

final myController = TextEditingController();

Dann dem TextField einen controller hinzufügen.

child: TextField(
controller: myController,
autocorrect: false,
autofocus: false,
decoration: InputDecoration(labelText: 'Name',alignLabelWithHint: true),
),

Der Wert des controllers kann jetzt per
mycontroller.text in ein Text(), Widget
eingefügt werden.

Text(mycontroller.text),

Container mit Verlauf-Hintergrundfarbe:

child: Container(
decoration: BoxDecoration(
color: Colors.pink,
gradient: LinearGradient(
begin: Alignment.topRight,
end: Alignment.bottomLeft,
stops: [0, 1],
colors: [
Colors.indigo[50],
Colors.indigo[400]
],
),
),
),

Portrait Mode festlegen:

import 'package:flutter/services.dart';

void main(){

SystemChrome.setPreferredOrientations([DeviceOrientation.portraitUp]);

runApp(MaterialApp(…

Debug-Banner ausblenden:

void main(){
runApp(MaterialApp(

debugShowCheckedModeBanner: false,

Volle Bildschirmbreite festlegen:

width: MediaQuery.of(context).size.width,

Volle Bildschirmhöhe festlegen:

height: MediaQuery.of(context).size.height,

AppBar Widget mit Button auf linker Seite:

appBar: AppBar(
centerTitle: true,
title: Text('Der liebe Hund'),
backgroundColor: Colors.red,
toolbarOpacity: 0.5,
elevation: 20.0,
leading: IconButton(
icon: Icon(Icons.menu),
onPressed: (){},
),
),

Container Widget mit Farbverlauf und runden Ecken:

Container(
width:200.0,
height:190.0,
margin: EdgeInsets.all(20.0),
padding: EdgeInsets.all(10.0),
decoration: BoxDecoration(
color: Colors.blue,
gradient: LinearGradient(
colors: [Colors.red, Colors.cyan],
),
borderRadius:BorderRadius.all(Radius.circular(16.0)),
),
),

Container Widget nur obere runde Ecken (color muss immer in der BoxDecoration angegeben werden, nicht im Container!):

decoration: BoxDecoration(
color: Colors.black.withOpacity(0.5),
borderRadius:BorderRadius.only(
topLeft: const Radius.circular(16.0),
topRight: const Radius.circular(16.0)
)
),

Text Widget:

Text('Hier steht Dein Text!',
textAlign: TextAlign.left,
style: TextStyle(
color: Colors.white,
fontSize: 12.0,
fontWeight: FontWeight.bold,
),
),

Eigener Browser:

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

void main(){
runApp(MaterialApp(
debugShowCheckedModeBanner: false,
home: MyApp(),
theme: ThemeData(
primarySwatch: Colors.purple,
),
));
}

class MyApp extends StatefulWidget{
@override
_MyAppState createState() => _MyAppState();
}
class _MyAppState extends State<MyApp> {
TextEditingController controller = TextEditingController();
var urlString = 'https://coach-hoffmann.de';
launchUrl(){
setState(() {
urlString = controller.text;
FlutterWebviewPlugin().reloadUrl(urlString);
});
}

@override
Widget build(BuildContext context){
return WebviewScaffold(
appBar: AppBar(
backgroundColor: Colors.blue,
title: Text('Coach Reader 1.0'),
),
url: 'https://coach-hoffmann.de',
withZoom: false,
withJavascript: true,
withLocalStorage: true,
clearCache: true,
clearCookies: true,
);
}
}

Eintrag in pubspec.yaml
permission_handler: ^3.0.0

In AndroidManifest.xml einfügen:
<uses-permission android:name=“android.permission.WRITE_EXTERNAL_STORAGE“ />

Permission einholen:
import 'package:permission_handler/permission_handler.dart';

Buttonfunktion:

onPressed: () async {
Map permissions =
await PermissionHandler()
.requestPermissions([PermissionGroup.storage]);
if (permissions[PermissionGroup.storage] ==
PermissionStatus.granted) {
final myDir = Directory('/storage/emulated/0/hallo');
myDir.exists().then((isThere) {
isThere
? Directory('/storage/emulated/0/hallo')
.delete(recursive: true)
: print(’non-existent‘);
});
} else {
print('Permission request fail!');
}
}

Basisseite

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

void main() {
SystemChrome.setPreferredOrientations([DeviceOrientation.portraitUp]);
runApp(MyApp());
}

class MyApp extends StatefulWidget {
@override
_MyAppState createState() => _MyAppState();
}

class _MyAppState extends State<MyApp> {
@override
Widget build(BuildContext context) {
return MaterialApp(
debugShowCheckedModeBanner: false,
title: 'App Titel',
home: ScreenOne(),
);
}
}

class ScreenOne extends StatefulWidget {
@override
_ScreenOneState createState() => _ScreenOneState();
}

class _ScreenOneState extends State<ScreenOne> {
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: Text('AppBar Titel Startseite'),
),
body: Container(
decoration: BoxDecoration(
color: Colors.blue,
gradient: LinearGradient(
colors: [Colors.purple, Colors.blue],
),
),
child: Center(
child: RaisedButton(
child: Text('Seite 2'),
onPressed: () {}),
),
));
}
}

Flutter Hilfen

Flutter Demo App

Basisseite

Passwort benötigt?