2017-10-16 17 views
0

react-native-drawer-menuモジュールを使用してスライダーメニューを作成しようとしています。モジュールを取り付けた後。可変的なスタイルを見つけることができません。これは、例からコピーされたコードです。正しいネイティブドロワーメニュー:可変スタイルを見つけることができません

import React from 'react'; 
import { StyleSheet, Text, View } from 'react-native'; 
import { Provider } from 'react-redux' 
import'../I18n/I18n.js'; 
import RootContainer from './RootContainer' 
import createStore from '../Redux' 
import Drawer from 'react-native-drawer-menu'; 
import {Easing} from 'react-native'; // Customize easing function (Optional) 

// create store 
const store = createStore() 

export default class App extends React.Component { 
    render() { 
    // prepare your drawer content 
    var drawerContent = (<View style={styles.drawerContent}> 
    <View style={styles.leftTop}/> 
    <View style={styles.leftBottom}> 
     <View><Text>Drawer Content</Text></View> 
    </View> 
    </View>); 
    var customStyles = { 
    drawer: { 
     shadowColor: '#000', 
     shadowOpacity: 0.4, 
     shadowRadius: 10 
    }, 
    mask: {}, // style of mask if it is enabled 
    main: {} // style of main board 
    }; 
    return (
    <Drawer 
     style={styles.container} 
     drawerWidth={300} 
     drawerContent={drawerContent} 
     type={Drawer.types.Overlay} 
     customStyles={{drawer: styles.drawer}} 
     drawerPosition={Drawer.positions.Right} 
     onDrawerOpen={() => {console.log('Drawer is opened');}} 
     onDrawerClose={() => {console.log('Drawer is closed')}} 
     easingFunc={Easing.ease} 
    > 
     <View style={styles.content}> 
     <Text>{Object.values(Drawer.positions).join(' ')}</Text> 
     <Text>{Object.values(Drawer.types).join(' ')}</Text> 
     </View> 
    </Drawer> 
); 
} 
} 

変数をコードから削除すると、スライドメニューは機能しますが、非常に悪く見えます。

enter image description here

あなたは、私が自分でメニューのスタイルを作成することが出来るのですか、私はどこから輸入するものだと思いますか?作成する必要がある場合、どのパラメータを取るのかをどのように知ることができますか?それとも普通の見方ですか?

答えて

1

自分でスタイルを追加して、引き出しの内容を正確に見たいと思われるようです。それを達成するには、ネイティブスタイルシートのプロパティに反応についてあなたはより多くの情報を得るためにthis答えを使用することができますStylesheet

を作成する必要があります(これはCSSとほとんど似ています)また

は多分引き出しレポから、この例のようになり helpful

乾杯。

関連する問題