DropDownMenu component upgraded to last version.

shoutem · Mar 23, 2017 · 8da170b · 8da170b
1 parent 8b0f53f
commit 8da170b
Showing 1 changed file with 29 additions and 27 deletions.
diff --git a/examples/ShoutemAnimation/App.js b/examples/ShoutemAnimation/App.js
@@ -27,48 +27,50 @@ const examples = {
 export class App extends Component {
   constructor() {
     super();
+    this.components = [{
+      example: 'Parallax',
+      component: 'Parallax',
+    }, {
+      example: 'Hero Header + ScrollDriver Animations',
+      component: 'HeroHeader',
+    }, {
+      example: 'FadeIn + FadeOut (TimingDriver)',
+      component: 'FadeInOut',
+    }, {
+      example: 'ZoomIn + ZoomOut (TimingDriver)',
+      component: 'ZoomInOut',
+    }, {
+      example: 'ZoomIn (TouchableDriver)',
+      component: 'ZoomInTouchable',
+    }, {
+      example: 'Rotate (TimingDriver)',
+      component: 'Rotate',
+    }, {
+      example: 'SlideIn + SlideOut (TimingDriver)',
+      component: 'SlideInOut',
+    }];
+
     this.state = {
-      selectedComponent: 'Parallax',
+      selectedComponent: this.components[0],
     };
   }
 
   render() {
-    const { selectedComponent } = this.state;
-    const SelectedComponent = examples[selectedComponent];
+    const SelectedComponent = examples[this.state.selectedComponent.component];
     return (
       <Screen>
         <Divider />
         <DropDownMenu
           styleName="horizontal"
-          options={[{
-            example: 'Parallax',
-            component: 'Parallax',
-          }, {
-            example: 'Hero Header + ScrollDriver Animations',
-            component: 'HeroHeader',
-          }, {
-            example: 'FadeIn + FadeOut (TimingDriver)',
-            component: 'FadeInOut',
-          }, {
-            example: 'ZoomIn + ZoomOut (TimingDriver)',
-            component: 'ZoomInOut',
-          }, {
-            example: 'ZoomIn (TouchableDriver)',
-            component: 'ZoomInTouchable',
-          }, {
-            example: 'Rotate (TimingDriver)',
-            component: 'Rotate',
-          }, {
-            example: 'SlideIn + SlideOut (TimingDriver)',
-            component: 'SlideInOut',
-          }]}
-          onOptionSelected={(option) => this.setState({ selectedComponent: option.component })}
+          options={this.components}
+          selectedOption={this.state.selectedComponent}
+          onOptionSelected={(option) => this.setState({ selectedComponent: option })}
           titleProperty="example"
           valueProperty="component"
         />
+
         <SelectedComponent />
       </Screen>
     );
   }
 }
-