Using Static and dynamic components in same view FB 4.5 Mobile App

I am in the process of recreating our desktop app for Android Tablets.

The app has various views accessed via an actionBar:

Module 1 | Module 2 | Module 3 | Module 4

Each of these is obviously a view. However here is my issue.

In the desktop version (in MODULE 1) we have views that contain a component that will stay on screen on the left hand side and on the right hand side we have components that will change depending on actions taken on left side. (A custom built list component on the left and data on the right) The data on the right has SEVEN sub views to it that basically show different content when each is selected.

In the Desktop App, we used the ViewStack to do this. Pressing the list item and change what shows in viewStack on the right. Then within that ViewStack are 7 more buttons that can be clicked to change what is shown in that view.

However in the Android App we cannot use the viewStack as it isn't optimised. So I need to know what is best for doing this view change? I want to avoid States as much as possible.

Hope that makes sense, as it is diff开发者_运维知识库icult to describe without breaking the NDA.

The solution I'd recommend is to create a formal spark component; and deal with the view changes in your custom skin class.

Creating MobileSkin classes can suck because it's all ActionScript. They don't use the formal Flex state mechanism [which you want to avoid]; but you'd be stuck writing code to determine which components to display. Conceptually something like this:

if(currentState == 'displayUIComp1'){
  displayUIComp1.visible = true;
  displayUIComp2.visible = false;
} else if(currentState == 'displayUIComp2'){
  displayUIComp1.visible = false;
  displayUIComp2.visible = true;
}