0

I have been developing mobile apps within Flex for a long time now and this issue is really annoying. I have an application that I want to use with the Split View Navigation. So when the App is in Landscape the menu will be on the left of the split screen and when in portrait it will appear as a button at the top.

I have gone through the exact steps as I know them on how to achieve this. Below is what I have in my Default Package File:

<s:states>
        <s:State name="portrait"/>
        <s:State name="landscape"/>
    </s:states> 

    <s:SplitViewNavigator id="svn" width="100%" height="100%" autoHideFirstViewNavigator="true">
        <s:ViewNavigator id="leftNav" width="310" height="100%" firstView="views.Menu"/>
        <s:ViewNavigator id="rightNav" width="100%" height="100%" firstView="views.Home">
            <s:actionContent.portrait>
            <s:Button id="NavButton" label="Menu" fontSize="15" click="svn.showFirstViewNavigatorInPopUp(NavButton)"/>
            </s:actionContent.portrait>         
        </s:ViewNavigator>
    </s:SplitViewNavigator>

however when I use this code and the app is in landscape I can still see the menu button in the right pane at the top, whats even stranger is if I click this button when in landscape the right hand section will expand to fill the screen and the menu will go into the pop-out box.

Is there something I am missing here or something else I have to set as have tried about 20 different approaches with no luck and its sooooo frustrating? Thanks in advance :-)

user723858
  • 1,007
  • 3
  • 23
  • 45

1 Answers1

0

I know this is an old question, but it's something that happens to a lot of people!

So the solution is actually very simple, just add visible.landscape="false" to your button and you're done, so you'll end up with the button tag like this:

<s:Button visible.landscape="false" id="NavButton" label="Menu" fontSize="15" click="svn.showFirstViewNavigatorInPopUp(NavButton)"/>

I see on you comments that the states are changing when device rotation is changed, but if for some reason this isn't working, you could add a resize event handler to your application (or view) and then do something like

protected function resizeHandler(event:ResizeEvent):void
{
   if( width > height ){
      currentState = "landscape";
   }else{
      currentState = "portrait";
   }
}

Again i know you may probably already have solved this, but maybe it'll help someone else!

polloss
  • 386
  • 3
  • 6