kylefang/react-native
1
0
Fork 0
mirror of https://github.com/zhigang1992/react-native.git synced 2026-04-17 23:04:40 +08:00
Code Issues Packages Projects Releases Wiki Activity

Kill require('image!...')

Browse Source 
Reviewed By: yungsters

Differential Revision: D4179964

fbshipit-source-id: e56ee7814e23a3afc6223527f1afefe51a9e0aec
This commit is contained in:
Alex Kotliarskyi
2016-11-22 21:01:36 -08:00
committed by Facebook Github Bot
parent cab88104a3
commit 22141468ab
7 changed files with 123 additions and 19 deletions
Download Patch File Download Diff File Expand all files Collapse all files

44
Examples/UIExplorer/js/ToolbarAndroidExample.android.js
View File

@@ -24,6 +24,8 @@
var React = require('react');
var ReactNative = require('react-native');
var nativeImageSource = require('nativeImageSource');
var {
StyleSheet,
Text,
@@ -54,7 +56,11 @@ class ToolbarAndroidExample extends React.Component {
<UIExplorerBlock title="Toolbar with title/subtitle and actions">
<ToolbarAndroid
actions={toolbarActions}
navIcon={require('image!ic_menu_black_24dp')}
navIcon={nativeImageSource({
android: 'ic_menu_black_24dp',
width: 48,
height: 48
})}
onActionSelected={this._onActionSelected}
onIconClicked={() => this.setState({actionText: 'Icon clicked'})}
style={styles.toolbar}
@@ -64,7 +70,11 @@ class ToolbarAndroidExample extends React.Component {
</UIExplorerBlock>
<UIExplorerBlock title="Toolbar with logo & custom title view (a View with Switch+Text)">
<ToolbarAndroid
logo={require('image!launcher_icon')}
logo={nativeImageSource({
android: 'launcher_icon',
width: 132,
height: 144
})}
style={styles.toolbar}>
<View style={{height: 56, flexDirection: 'row', alignItems: 'center'}}>
<Switch
@@ -83,13 +93,25 @@ class ToolbarAndroidExample extends React.Component {
<UIExplorerBlock title="Toolbar with navIcon & logo, no title">
<ToolbarAndroid
actions={toolbarActions}
logo={require('image!launcher_icon')}
navIcon={require('image!ic_menu_black_24dp')}
logo={nativeImageSource({
android: 'launcher_icon',
width: 132,
height: 144
})}
navIcon={nativeImageSource({
android: 'ic_menu_black_24dp',
width: 48,
height: 48
})}
style={styles.toolbar} />
</UIExplorerBlock>
<UIExplorerBlock title="Toolbar with custom title colors">
<ToolbarAndroid
navIcon={require('image!ic_menu_black_24dp')}
navIcon={nativeImageSource({
android: 'ic_menu_black_24dp',
width: 48,
height: 48
})}
onIconClicked={() => this.setState({colorProps: {}})}
title="Wow, such toolbar"
style={styles.toolbar}
@@ -125,9 +147,17 @@ class ToolbarAndroidExample extends React.Component {
}
var toolbarActions = [
{title: 'Create', icon: require('image!ic_create_black_48dp'), show: 'always'},
{title: 'Create', icon: nativeImageSource({
android: 'ic_create_black_48dp',
width: 96,
height: 96
}), show: 'always'},
{title: 'Filter'},
{title: 'Settings', icon: require('image!ic_settings_black_48dp'), show: 'always'},
{title: 'Settings', icon: nativeImageSource({
android: 'ic_settings_black_48dp',
width: 96,
height: 96
}), show: 'always'},
];
var styles = StyleSheet.create({