Is there any possible way to have multi layer view?

Ionic Framework ionic-v3
#1

Is there any possible way to show or to have multi layer view. I mean UI component in are independently but both of them could be focused?
for example : showing text box over an image, and person could entering text in text box, and without closing input box could replace or dragging image under the box.

#2

I used this code , but it shows error

<ion-fab top>   
     <ion-item>
       <ion-label fixed>Username</ion-label>
     <ion-input type="text" value=""></ion-input> 
  </ion-item>
![image](upload://q5caB8Okt9C7zcZsKJBkBaw3GGz.png)
#3

is there any better idea instead of using <ion-fab> tag?

#4

Hello,
I’m completly new to ionic. So this is only a guess.

The documentation have a button inside followed by . It seems that the failure message says that this button is not present. And next the list is also absent.

I do not really understand, what you want achieve with your descripted scenario, so I can’t really help with that.

Best regards, anna

#5

A FAB needs a button because it’s on top of all other UI components by default (Absolute positioning). It’s meant for “plus buttons” or that kind of buttons on top of your actual page.
I would suggest a simplier approach.

So instead of this:

<ion-fab top>   
     <ion-item>
       <ion-label fixed>Username</ion-label>
     <ion-input type="text" value=""></ion-input> 
  </ion-item>

Try this:

<ion-fab top>   
     <ion-item>
       <ion-icon add></ion-icon>
       <ion-button click="goToPageWithForm()"></ion-button> 
  </ion-item>
</ion-fab>

And make a function for that in your page to redirect to proper page.

As for multi-layer view, you can have plenty of FABS on same page, and overwrite default z-index through CSS too. But Ionic is limited in terms of CSS, animations, and z-index use. When you learn, you should better go with default components (for example, navController is already a stack of multiple views you pile or remove with standard controls, just like a pile of cards, using both push() or pop()).

For more control, you can also use ViewController.

1 Like
#6

Do you find any better way to show inputbox over map?