DEV/flutter_flutter
1
0
Fork 0
mirror of https://github.com/flutter/flutter.git synced 2026-02-20 02:29:02 +08:00
Code Issues Packages Projects Releases Wiki Activity

Morph "appish" example into a "stocks" app

Browse Source 
We'll flesh this example out over time to demo a bunch of our widgets.

TBR=eseidel@chromium.org

Review URL: https://codereview.chromium.org/954503002
This commit is contained in:
Adam Barth 2015-02-23 09:30:11 -08:00
parent e33c3ffadf
commit 16bd322935
2 changed files with 0 additions and 96 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

84
engine/src/flutter/examples/appish/example-scaffold.sky
View File

@ -1,84 +0,0 @@
<!--
// Copyright 2015 The Chromium Authors. All rights reserved.
// Use of this source code is governed by a BSD-style license that can be
// found in the LICENSE file.
-->
<import src="/sky/framework/sky-drawer.sky" />
<import src="/sky/framework/sky-element.sky" />
<import src="/sky/framework/sky-scrollable.sky" />
<sky-element>
<template>
<style>
:host {
display: flex;
flex-direction: column;
height: -webkit-fill-available;
}
sky-drawer {
position: absolute;
z-index: 1;
top: 0;
left: 0;
bottom: 0;
right: 0;
}
sky-toolbar {
display: flex;
align-items: center;
background-color: #526E9C;
color: white;
height: 56px;
}
#menu {
display: flex;
justify-content: center;
align-items: center;
width: 24px;
height: 24px;
padding: 7px;
margin: 0 8px;
background-color: papayawhip;
color: black;
}
#title {
flex: 1;
margin: 0 8px;
}
sky-scrollable {
flex: 1;
background-color: green;
}
</style>
<sky-drawer id="drawer">
<content select=".menu"/>
</sky-drawer>
<sky-toolbar>
<div id="menu" />
<content id="title" select=".title"/>
</sky-toolbar>
<sky-scrollable>
<content />
</sky-scrollable>
</template>
<script>
import "dart:sky";
@Tagname('example-scaffold')
class ExampleScaffold extends SkyElement {
Element _drawer;
void shadowRootReady() {
_drawer = shadowRoot.getElementById('drawer');
Element menu = shadowRoot.getElementById('menu');
menu.addEventListener('click', _handleMenuClick);
}
void _handleMenuClick(_) {
_drawer.toggle();
}
}
_init(script) => register(script, ExampleScaffold);
</script>
</sky-element>

12
engine/src/flutter/examples/appish/index.sky
View File

@ -1,12 +0,0 @@
#!mojo mojo:sky_viewer
<!--
// Copyright 2015 The Chromium Authors. All rights reserved.
// Use of this source code is governed by a BSD-style license that can be
// found in the LICENSE file.
-->
<import src="example-scaffold.sky" />
<example-scaffold>
<div class="title">Awesome app</div>
<div class="menu">This is a menu</div>
<div class="body">This is an awesome app.</div>
</example-scrollable>