Navigation

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

    beebase

    @beebase

    2
    Reputation
    14
    Posts
    1132
    Profile views
    0
    Followers
    0
    Following
    Joined Last Online

    beebase Follow

    Posts made by beebase

    • RE: Preview! Vue.js support for Onsen UI

      Is there a working example available for a tabbar?
      (where each tab has its own Component/Page)

      I’ve used Angular 1 , React-native, ReactJS.
      Vue.js syntax is silky compared to those. Love it!

      posted in News & Announcements
      B
      beebase
    • Struggling getting a page set up with toolbar-tabbar-footer

      I can’t get this set up correctly.
      Toolbar (above tabbar) and Footer (beneath tabbar) stay hidden under the Tabbar pages.

      Is there a way to fix this?

      render() {
          return (
            <Page>
              <Toolbar inline>
                <div className="left"><BackButton>Back</BackButton></div>
                <div className="center">{'Skill' + this.props.skill.skillNr}</div>
              </Toolbar>
              <Tabbar
                index={this.state.index}
                position='top'
                onPreChange={({index}) => this.setState({index})}
                renderTabs={this.renderTabs.bind(this)}
              />
              <Footer />
            </Page>
          );
        }
      
      posted in Onsen UI
      B
      beebase
    • this.props not rendering in <Page>

      I don’t understand why this.props.skill.skillNr is not rendering in OnsenUI.
      There seems to be some kind of timing problem.
      I’m using phonegap-template-react-hot-loader as a template for my project.

      Reactjs constructor with console.log(…
      0_1472824625112_img2225.jpg
      console.log in the browser
      0_1472824612869_img2226.jpg

      this.props.skill.skillNr referenced in <Page><Toolbar…
      0_1472824603376_img2227.jpg
      result in the app
      0_1472824597161_img2228.jpg

      posted in Onsen UI
      B
      beebase
    • RE: How to create a horizontal scrolling list in OnsenUI-Reactjs?

      Ah, found it. isSwipeable={false} makes the scrollbar work perfectly.

        return (
            <Splitter>
              <SplitterSide
                isSwipeable={false}>
      
      posted in Onsen UI
      B
      beebase
    • RE: How to create a horizontal scrolling list in OnsenUI-Reactjs?

      Thanks, unordered list works well except not with the Splitter (sidebar navigation) as the outer component of the app.
      Is there a way to disable the Splitter on certain pages?
      Or should I set the Navigator (stacked navigation) as outer component and then add the splitter on pages where I need them?

      (index.html)

       <Splitter>
              <SplitterSide
                side='left'
                collapse={true}
                isOpen={this.state.isOpen}
                onClose={this.hide.bind(this)}
                isSwipeable={true}>
                <Page>
                  Menu content
                </Page>
              </SplitterSide>
              <SplitterContent>
                <Navigator initialRoute={{component: Skills}}
                           renderPage={this.renderPage}/>
              </SplitterContent>
            </Splitter>
      
      posted in Onsen UI
      B
      beebase
    • RE: How to create a working project with React and Material-ui?

      I understand that using React with the online tool is not possible.

      I’ve set up a blank project with Local CLI but what I still don’t understand is how to add js libraries.
      Normally I would config webpack with babel to compile react, es6, css, ui libraries etc., but Monaca is already running a webpack instance. How do I solve this?

      posted in Monaca Tools
      B
      beebase
    • How to create a working project with React and Material-ui?

      I’m trying to build a project from scratch (no framework) with a blank template.
      Then I’m attaching JS Components React and material-ui.

      Should this work out of the box?
      I don’t see how the components loader is going to kick in.

      Should I add something my self?
      Are there any examples how to build custom projects with various JS components?

      generated index.html
      0_1472384949604_img2176.jpg

      imported react as a JSComponent
      0_1472384963992_img2178.jpg

      posted in Monaca Tools
      B
      beebase
    • Where do I change the onsen-ui theme?

      I see you can add css components with the Monaca online tool.
      However my project is set up with Reactjs. which excludes using the online tool.

      I can only use the Monaca CLI for builds etc., but I can’t see how to add/remove JS/CSS components.

      posted in Monaca Tools
      B
      beebase
    • RE: Icons not showing on android device, but they do in browser preview

      @beebase I did a new install. Seems to work now.

      posted in Monaca Tools
      B
      beebase
    • Icons not showing on android device, but they do in browser preview

      monaca preview: All icons display fine.
      monaca debug: All icons appear as placeholders with a cross.

      Any ideas?

      OnsenUI 2 with Reactjs

      posted in Monaca Tools
      B
      beebase