Navigation

    Monaca & Onsen UI
    • Login
    • Search
    • Tags
    • Users
    • Blog
    • Playground
    1. Home
    2. iriekun
    I
    • Flag Profile
    • Profile
    • Following
    • Followers
    • Blocks
    • Topics
    • Posts
    • Best
    • Groups
    Save
    Saving

    iriekun

    @iriekun

    0
    Reputation
    30
    Posts
    1096
    Profile views
    1
    Followers
    0
    Following
    Joined Last Online

    iriekun Follow

    Posts made by iriekun

    • RE: how to make tab active [onsen with react js]

      @munsterlander but when I put it in the meteor project, it still doesn’t show the initial tab! I tried everything now! Could it have the conflict with meteor or what?

      posted in Onsen UI
      I
      iriekun
    • RE: how to make tab active [onsen with react js]

      @munsterlander no tab is active at all!

      0_1483038375514_Screen Shot 2016-12-29 at 20.05.43.png

      posted in Onsen UI
      I
      iriekun
    • RE: how to make tab active [onsen with react js]

      @munsterlander i also tried it but it doesn’t work!!! I couldn’t understand why! It shoudn’t be that complicated!!! I also tried to use initialndex from this example
      https://onsen.io/blog/react-onsen-ui-navigator-tabs/#nodebb/comments
      but still it didn’t work too!

      here is my code

      class Home extends React.Component {
        gotoComponent(component) {
          this.props.navigator.pushPage({comp: component});
        }
      
        renderToolbar() {
          return (
            <Toolbar>
              <div className='center'>Home</div>
            </Toolbar>
          );
        }
      
        render() {
          return (
            <Page renderToolbar={this.renderToolbar}>
              <List
                renderHeader={() => <ListHeader>Components</ListHeader>}
                dataSource={[{
                  name: 'Story Mission',
                  component: StoryCarousel
      		  }, {
                  name: 'Speed dials',
                  component: StoryCarousel
                }]}
                renderRow={(row) =>
                  <ListItem tappable onClick={this.gotoComponent.bind(this, row.component)}>
                    {row.name}
                  </ListItem>
                }
              />
            </Page>
          );
        }
      }
      
      var Tabs = React.createClass({
      	getInitialState: function() {
          return {
            index: 0
          }
        },
        renderTabs: function() {
          return [
            {
              content: <Home navigator={this.props.navigator}/>,
              tab: <Ons.Tab label="Home" icon="ion-ios-home-outline" active />
            },
            {
              content: <Home navigator={this.props.navigator} />,
              tab: <Ons.Tab label="Dialogs" icon="ion-ios-albums-outline" />
            },
            {
              content: <Home />,
              tab: <Ons.Tab label="Forms" icon="ion-edit" />
            }
          ];
        },
      
        render: function() {
          return (
            <Ons.Page>
              <Ons.Tabbar
                renderTabs={this.renderTabs}
              />
            </Ons.Page>
          );
        }
      });
      
      class App extends React.Component {
        renderPage(route, navigator) {
          const props = route.props || {};
          props.navigator = navigator;
      
          return React.createElement(route.component, props);
        }
      
        render() {
          return (
            <Ons.Navigator
              initialRoute={{component: Tabs, props: {key: 'main'}}}
              renderPage={this.renderPage}
            />
          );
        }
      }
      
      export default App;
      
      posted in Onsen UI
      I
      iriekun
    • RE: Navigation and Tabs in the Onsen UI React Extension

      Hi! I tried everything from tutorials. I also use props initialIndex but still couldn’t make tab active initially. I use onsen-react with meteor. please guide me too!

      posted in Monaca & Onsen UI Articles
      I
      iriekun
    • RE: Safari on Windows and iOS App doesnt select initial Tab

      Hi!

      @Julian-Wagner I also run the demo example but it doesn’t show the initial tab active at all! How can you make the first tab active when first going to the tab page?

      posted in Onsen UI
      I
      iriekun
    • RE: how to make tab active [onsen with react js]

      Hi! any help???

      posted in Onsen UI
      I
      iriekun
    • how to make tab active [onsen with react js]

      Hello,

      I follow this tutorial https://github.com/OnsenUI/react-onsenui-kitchensink/blob/master/main.js

      but i couldn’t make the tab home active! I didn’t see any line of example code make tab active too but in demo the home tab is active.

      Could you please tell me how to make a tab active(for example Home tab) by default? What I am trying to do is after user login it will link to the tab page with home tab active

      thank you

      posted in Onsen UI
      I
      iriekun
    • RE: Is there only material design theme for android?

      okay thank you a lot :)

      posted in Onsen UI
      I
      iriekun
    • RE: Is there only material design theme for android?

      @munsterlander can you tell how can i use iOS flat on android? because when i run on android, the theme change to material design automatically

      posted in Onsen UI
      I
      iriekun
    • onsen with express js

      Since onsen ui is the framework for only front-end development, I suppose it would work with any backend language and language. Is it possible if I combine onsen with express js?

      posted in Onsen UI
      I
      iriekun