2017-02-22 14 views
1

誰かがこのコードで何が問題なのか教えてください。私はシミュレータを実行するとうまく動作しますが、コンテンツをスワイプしても表示されません。引き出しは動作しません。私は間違って何をしていますか?NativeBase Drawerがスワイプしない

import React, { Component } from 'react'; 
import { Drawer } from 'native-base'; 
import { Navigator, View } from 'react-native'; 

export default class DrawerExample extends Component { 

constructor(props) { 
super(props); 
this.state = { 
toggled: false, 
store: {}, 
theme: null 
}; 
} 

toggleDrawer() { 
this.state.toggled ? this._drawer.close() : this._drawer.open(); 
} 

openDrawer() { 
this.setState({toggled: true}); 
} 

closeDrawer() { 
this.setState({toggled: false}); 
} 

renderScene(route, navigator) { 
switch(route) { 
    default: return null; 
} 
} 
configureScene(route, routeStack) { 
return Navigator.SceneConfigs.PushFromRight; 
} 
render() { 
return (
    <Drawer 
     ref={(ref) => this._drawer = ref} 
     type='displace' 
     content={<View style={{backgroundColor: '#000', height: 1000}} />} 
     onClose={this.closeDrawer.bind(this)} 
     onOpen={this.openDrawer.bind(this)} 
     openDrawerOffset={100} 
     > 
     <Navigator 
      ref={(ref) => this._navigator = ref} 
      configureScene={this.configureScene.bind(this)} 
      renderScene={this.renderScene.bind(this)} 
     /> 
     </Drawer> 
    ); 
     } 
     } 

答えて

6

panOpenMask={<value>}でこれを達成できます。 .25の値でテストしました。

APIは言う:

panOpenMask(ナンバー)null - パンオープンアクションの開始のための有効なスクリーン幅の比率。 nullの場合 - >デフォルトにmax(.05, closedDrawerOffset)

EDIT:

私の完全なコード(私自身のプロジェクトでは)次のとおりです。

<Drawer 
    ref={(ref) => { this._drawer = ref; }} 
    content={ navigationView } 
    side="right" 
    panOpenMask={.25} 
> 
+1

グレート!私は自分のボイラプレートのために私のプロジェクトで 'acceptPan = {false}'を使用していました。私はそれを「真」に変更したので、スワイプで引き出しを開閉することができます。ありがとう。 – milkersarac

+0

そのことについて知りませんでした。私はおそらくスイッチを作るでしょう。私はむしろ '.25'のような乱数よりむしろブールを持つだろう。乾杯〜 – Ethan

+0

文書のどこにこれが説明されているのか教えてください。私はこれに苦労し、ドキュメントをレビューした後でこの投稿を見つけました。私はpanOpenMaskに関して何も見ませんでした。 https://docs.nativebase.io/COMPONENTS.html#Drawer – Aaron

関連する問題