{"action":"opened","issue":{"url":"https://api.github.com/repos/react-native-community/react-native-tab-view/issues/507","repository_url":"https://api.github.com/repos/react-native-community/react-native-tab-view","labels_url":"https://api.github.com/repos/react-native-community/react-native-tab-view/issues/507/labels{/name}","comments_url":"https://api.github.com/repos/react-native-community/react-native-tab-view/issues/507/comments","events_url":"https://api.github.com/repos/react-native-community/react-native-tab-view/issues/507/events","html_url":"https://github.com/react-native-community/react-native-tab-view/issues/507","id":316001178,"number":507,"title":"No examples will work","user":{"login":"jstansbe","id":1250522,"avatar_url":"https://avatars1.githubusercontent.com/u/1250522?v=4","gravatar_id":"","url":"https://api.github.com/users/jstansbe","html_url":"https://github.com/jstansbe","followers_url":"https://api.github.com/users/jstansbe/followers","following_url":"https://api.github.com/users/jstansbe/following{/other_user}","gists_url":"https://api.github.com/users/jstansbe/gists{/gist_id}","starred_url":"https://api.github.com/users/jstansbe/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/jstansbe/subscriptions","organizations_url":"https://api.github.com/users/jstansbe/orgs","repos_url":"https://api.github.com/users/jstansbe/repos","events_url":"https://api.github.com/users/jstansbe/events{/privacy}","received_events_url":"https://api.github.com/users/jstansbe/received_events","type":"User","site_admin":false},"labels":[],"state":"open","locked":false,"assignee":null,"assignees":[],"milestone":null,"comments":0,"created_at":"2018-04-19T19:01:31Z","updated_at":"2018-04-19T19:01:31Z","closed_at":null,"author_association":"NONE","body":"\r\n\r\n### Current behaviour\r\n\r\nUsing the code template from TopBarTextExample doesnt show any views. \r\n\r\n### Expected behaviour\r\n\r\nUpon clicking a tab header, show the respective view.\r\n\r\n### Code sample\r\n\r\n```\r\nimport * as React from 'react';\r\nimport { StyleSheet, Dimensions, View } from 'react-native';\r\nimport { TabViewAnimated, TabBar, SceneMap } from 'react-native-tab-view';\r\nimport SimplePage from './SimplePage';\r\n\r\n\r\n\r\n\r\nconst Albums = () => <View style={[ styles.container, { backgroundColor: '#ff4081' } ]}></View>;\r\nconst Contacts = () => <View style={[ styles.container, { backgroundColor: '#ff4081' } ]}></View>;\r\nconst Article = () => <View style={[ styles.container, { backgroundColor: '#ff4081' } ]}></View>;\r\nconst Chat = () => <View style={[ styles.container, { backgroundColor: '#ff4081' } ]}></View>;\r\n\r\n\r\n// type State = NavigationState<\r\n//   Route<{\r\n//     key: string,\r\n//     title: string,\r\n//   }>\r\n// >;\r\n\r\nconst initialLayout = {\r\n  height: 0,\r\n  width: Dimensions.get('window').width,\r\n};\r\n\r\nexport default class TopBarTextExample extends React.Component {\r\n    static title = 'Scrollable top bar';\r\n    static backgroundColor = '#3f51b5';\r\n    static appbarElevation = 0;\r\n  \r\n    state = {\r\n      index: 1,\r\n      routes: [\r\n        { key: 'article', title: 'Article' },\r\n        { key: 'contacts', title: 'Contacts' },\r\n        { key: 'albums', title: 'Albums' },\r\n        { key: 'chat', title: 'Chat' },\r\n      ],\r\n    };\r\n  \r\n    _handleIndexChange = index =>\r\n      this.setState({\r\n        index,\r\n      });\r\n  \r\n    _renderHeader = props => (\r\n      <TabBar\r\n        {...props}\r\n        scrollEnabled\r\n        indicatorStyle={styles.indicator}\r\n        style={styles.tabbar}\r\n        tabStyle={styles.tab}\r\n        labelStyle={styles.label}\r\n      />\r\n    );\r\n  \r\n    _renderScene = SceneMap({\r\n      albums: Albums,\r\n      contacts: Contacts,\r\n      article: Article,\r\n      chat: Chat,\r\n    });\r\n  \r\n    render() {\r\n      return (\r\n        <TabViewAnimated\r\n          style={[styles.container, this.props.style]}\r\n          navigationState={this.state}\r\n          renderScene={this._renderScene}\r\n          renderHeader={this._renderHeader}\r\n          onIndexChange={this._handleIndexChange}\r\n          initialLayout={initialLayout}\r\n        />\r\n      );\r\n    }\r\n  }\r\n  \r\n  const styles = StyleSheet.create({\r\n    container: {\r\n      flex: 1,\r\n    },\r\n    tabbar: {\r\n      backgroundColor: '#3f51b5',\r\n    },\r\n    tab: {\r\n      width: 120,\r\n    },\r\n    indicator: {\r\n      backgroundColor: '#ffeb3b',\r\n    },\r\n    label: {\r\n      color: '#fff',\r\n      fontWeight: '400',\r\n    },\r\n  });\r\n```\r\n\r\n\r\n### Screenshots (if applicable)\r\n\r\n![screenshot_1524164344](https://user-images.githubusercontent.com/1250522/39012362-3ae5fb06-43e2-11e8-9f70-b2eb163e5653.png)\r\n\r\n\r\n### What have you tried\r\n\r\nI've tried practically ALL of the examples and all have the same issue i've described. \r\nhttps://github.com/react-native-community/react-native-tab-view/tree/master/example\r\n\r\n### Your Environment\r\n\r\n| software              | version\r\n| --------------------- | -------\r\n| android        | 8.0.0\r\n| react-native          | 0.55.3\r\n| react-native-tab-view | 0.0.77\r\n| node                  | 8.9.4\r\n| yarn           |  1.3.2\r\n"}}
{"actor":{"display_login":"jstansbe"}}