Ext.toast position configuration

Question

Sencha Touch 2.4 has this new toast class(Ext.Toast), which looks nice. But, by default, the location of the toast is centered in the viewport. Is there any way I can push it towards the bottom?

I looked at the top config, but it doesn't work well. (Pushes it down, but it's not centered horizontally now).

Tried a combination of top and left configs, but it's not perfect. I don't seem to find any hints in the docs.

Basically, I need to display the toast around of 70% of the height, and it should be centered horizontally in the viewport.

score 1 · Answer 1 · answered Sep 19 '14 at 01:32

1

Not ideal but the following css will do it. Just change the number depending on high high you want it.

.x-toast {
    top: -150px; 
}

answered Sep 19 '14 at 01:32

rhawk

71
2

I wanted to push down the toast, so gave it a positive value, and it works. But, tried with percentages, but couldn't get it to work. Can I give it a relative position as per the height of the screen? Say, on a mobile device? – Kumar Bibek Sep 24 '14 at 05:36

score 0 · Answer 2 · edited Apr 19 '15 at 01:37

0

I've created a plugin that can create toast messages similar to Android style at the bottom of the screen.

edited Apr 19 '15 at 01:37

Nathan Tuggy

2,237
27
30
38

answered Apr 19 '15 at 01:16

barryloh

101
1
5

Welcome to Stack Overflow! In the future, please make sure to note whenever you're promoting something you yourself are involved in. – Nathan Tuggy Apr 19 '15 at 01:38

score 0 · Answer 3 · answered Nov 23 '15 at 07:25

0

I've also faced this problem I found the solution.You can also find it by the below link.

sample toast with different position and animation

answered Nov 23 '15 at 07:25

Mahesh B

19
4

You should edit relevant information for the solution into your post. – JHobern Nov 23 '15 at 07:42

Ext.toast position configuration

3 Answers3