-
-
Save sethladd/7397a067deb43b6052032195fcb26d94 to your computer and use it in GitHub Desktop.
Comparing Flutter to what it might look like in Kotlin, Dart.soon, and Dart.wishlist
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
/** | |
* This is a quick proof of concept to illustrate how the principles of Kotlin/Anko could be used to make Flutter | |
* more designer-friendly. | |
* | |
* Some liberty was taken with APIs. The constructors (Scaffold, AppBar) were lower-cased. | |
* The Flutter API uses uppercase for class names. | |
* | |
* @see Single Expression Functions (https://kotlinlang.org/docs/reference/functions.html#single-expression-functions) | |
* @see Groovy-Style Builders (https://kotlinlang.org/docs/reference/type-safe-builders.html) | |
* @see Extension Functions/Properties (https://kotlinlang.org/docs/reference/extensions.html#extension-properties) | |
* @see Anko Layouts (https://github.com/Kotlin/anko#anko-layouts-wiki) | |
*/ | |
class TutorialHome : StatelessWidget { | |
override | |
fun build(context: BuildContext) = scaffold { | |
appBar = appBar { | |
leading = iconButton { | |
iconImage = Icon(Icons.menu) | |
tooltip = "Navigation menu" | |
onPressed = null | |
} | |
titleText = "Example title" | |
actions = [ // based on https://twitter.com/abreslav/status/867714627060322305 | |
iconButton { | |
iconImage = Icon(Icons.search) | |
tooltip = "Search" | |
onPressed = null | |
} | |
] | |
} | |
body = center { | |
// Remember: This is a fully functional programming environment. You can execute any code you can think of. | |
child = Text("Hello ${MyApp.users.me.fullName.split(" ").first}!") | |
} | |
floatingActionButton = fab { | |
tooltip = "Add" | |
childImage = Icon(Icons.add) | |
onPressed = null | |
} | |
} | |
} |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
class TutorialHome extends StatelessWidget { | |
@override | |
Widget build(BuildContext context) { | |
// Scafold is a layout for the major material design widgets. | |
return new Scaffold( | |
appBar: new AppBar( | |
leading: new IconButton( | |
icon: new Icon(Icons.menu), | |
tooltip: 'Navigation menu', | |
onPressed: null, | |
), | |
title: new Text('Example title'), | |
actions: <Widget>[ | |
new IconButton( | |
icon: new Icon(Icons.search), | |
tooltip: 'Search', | |
onPressed: null, | |
), | |
], | |
), | |
// body is the majority of the screen. | |
body: new Center( | |
child: new Text('Hello, world!'), | |
), | |
floatingActionButton: new FloatingActionButton( | |
tooltip: 'Add', // used by assistive technologies | |
child: new Icon(Icons.add), | |
onPressed: null, | |
), | |
); | |
} | |
} |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
class TutorialHome extends StatelessWidget { | |
@override | |
Widget build(BuildContext context) => Scaffold( // implicit new!, also matching your Kotlin here | |
appBar: AppBar( | |
leading: IconButton( | |
icon: Icon(Icons.menu), | |
tooltip: 'Navigation menu', | |
onPressed: null, | |
), | |
title: Text('Example title'), | |
actions: [ // Dart + strong mode will infer the contents of the list | |
IconButton( | |
icon: Icon(Icons.search), | |
tooltip: 'Search', | |
onPressed: null, | |
), | |
], | |
), | |
// body is the majority of the screen. | |
body: Center( | |
child: Text('Hello, world!'), | |
), | |
floatingActionButton: FloatingActionButton( | |
tooltip: 'Add', // used by assistive technologies | |
child: Icon(Icons.add), | |
onPressed: null, | |
), | |
) | |
} |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
class TutorialHome extends StatelessWidget { | |
@override | |
Widget build(BuildContext context) => Scaffold( // implicit new!, also matching your Kotlin here | |
appBar: AppBar( | |
leading: IconButton( | |
icon: Icon(Icons.menu) | |
tooltip: 'Navigation menu' | |
onPressed: null | |
) | |
title: Text('Example title') | |
actions: [ // Dart + strong mode will infer the contents of the list | |
IconButton( | |
icon: Icon(Icons.search) | |
tooltip: 'Search' | |
onPressed: null | |
) | |
] | |
) | |
// body is the majority of the screen. | |
body: Center( | |
child: Text('Hello, world!') | |
) | |
floatingActionButton: FloatingActionButton( | |
tooltip: 'Add' // used by assistive technologies | |
child: Icon(Icons.add) | |
onPressed: null | |
) | |
) | |
} | |
} |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment