| This thread was migrated from an old forum. It may contain information that are no longer valid. For further assistance, please post a new question or open a support ticket from the Customer Support portal. |
Hello I have a problem because now in my team development we are testing our app in MAC and do you know the Zindex of widgets and flex matter but our app is almost finished and we created in windows and testing with android devices so I try to resolve problem with the functionality of widgets without affect the work of our desginer .
look:**Image removed for security reasons**
this is a screen for recharge the plan of mobile companie and has two buttons of the companies , below there are the quick menu and have 4 other option but you do a swipe up this happens:
**Image removed for security reasons**
you can see the options of the full menu mixed with the button options . and do you would think , well just change the zindex , well the problem is that :
the flex of the " accesorapido " quick menu have to fill the screen beacuse the full menu have to swipe up , but if I change Zindex 2 for example the buttons now are useless beacuse the quick menu are forward of them even doesn't see the button are cover up
**Image removed for security reasons**
how you see the quick menu had zindex1 so if a put zindex2 the titlebar doesn't work beacsue will be behind of the menu and the flxBtnsTransferencias "the buttons" will be in conflict
can some of you help me with that? I don't know if there is a code block like //#ifdef iphone
//#endif
that can resolve problems like this or another solution
Hi @Kevin Jones can you help with this question?
Hi @Alison Skinnew , I did not understand the issue completely but based on the screenshot as you mentioned the issue is because of zIndex. The layout that you have used is not as per the best practice so it needs to be changed. However, if you would like to do some work around through code you can try to play with zIndex. For example, when you click on the swipe up button you can change the zIndex of the menu to a higher value and then when you close it you can set it back to normal.
And yes, you can either you //#ifdef iphone or you can also use if(kony.os.deviceInfo().name==="iPhone") to make the code specific to only iPhone devices!
This would just be a workaround but the proper solution is to change the layout.
well it's some difficult to understand without a video of sometime but the quick menu has a flex container that fill the screen because when you do swipe the full menu is moving up and show the options, like the nowdays apps , but How can I do to put the buttons, scroll, etc of the screen like priority and the same time that reflect the quick menu is forward and later to swipe the options now are the priority?
**Image removed for security reasons**Try to do this through code.
ok because with just edit in the panel of properties just do that , the menu works , but then the buttons can't do tap to select them
@Kevin Jones hello I glad to tell you that I almost am close to resolve this I fixed the problem put the height of the component Menu much small and this way the form with buttons and segment scroll works and other form
**Image removed for security reasons**
but I have the next problem , when I do a tap in the menu the swipe just fill the 12% of the quick menu , but the scroll works and the tap options too just look:
**Image removed for security reasons**
these are the properties
**Image removed for security reasons**
the menu has a height of 12%
and the full menu size of 80% respect the size of menu but you can see is too small because the size of flex "accesorapido"
**Image removed for security reasons**
I tried to put
this.view.height = "100%" and
this.view.zindex = 2;
in the function inside the controller.js but doesn't work do you know how can I change the size to 100% just when the swipe up of the menu?
Also I don't know if this was the reason but the component in the forms projects looks this way:
**Image removed for security reasons**
it's normal that the template section there is aone first flex called "accesorapido" but in the forms projects that flex is the main flex?
@Alison Skinnew On swipe of the menu you can change the height of the flex.
You can either do this in an animate function
or
You can do it with just this.view.flx.height="80%";
if the height is not reflecting then you can try to use forceLayout();
this will make sure the layout refreshes to reflect the new properties.
@Kevin Jones how you can saw it in the photos the parent flexcontainer is called accesorapido so I tried this:
this.view.accesorapido.zIndex = 2;
this.view.accesorapido.height = "100%";
but when I make a click in the options of the menu the screen show this alert:
**Image removed for security reasons**
also I don't know but why in the template the coponent is called: menu.accesorapido and the project the component is just accesorapido that is the problem with the alert message ?
hello I can fixit with adding a snippet in the open menu fucntion and close menu function and even change some properties directly on component menu controller I did resolve stetic problems but I have a doubt.
the menu with that not have a natural swipe up and swipe down , is like aswipe with lag , do you think is because first the snippet change the properties and later do the move flex?**Image removed for security reasons**
Yes @Alison Skinnew it should be because of the animation sequence you are using. Try to do only one animation at a time and not parallely. If you want to do move and scale at in one time try to use the transform animation in which you can do both at once and it will be smooth.