Hi Guys, I have started work on bead view which provides navigation to TabBar. I have one case which I cannot resolve, so I thought maybe someone with some better HTML knowledge shot it's thoughts on that.
Problem: When TabBar has more buttons on the screen than available space I'm showing buttons for navigation. Unfortunately when page is loading - initially buttons are not showing. Following gif presents issue. As you can see initially there is not navigation button [1], but when I resize just a bit window they are showing and working great. [1] Code is on the branch [2]. Method [3] is responsible for showing/hiding buttons. Initially when page has been loaded all properties used in that method are showing 0. Maybe someone has some clue what is going on ? Similar code is working flawlessly in MDL. [1] https://gifyu.com/image/v9lv [2] https://github.com/apache/royale-asjs/tree/feature/add_nav_tabbar_bead [3] https://github.com/apache/royale-asjs/blob/ca771494ccf7361e2289d0b32c5d7aa7a6cf2f0c/frameworks/projects/Jewel/src/main/royale/org/apache/royale/jewel/beads/views/TabBarWithNavigationView.as#L143 Thanks, Piotr śr., 30 paź 2019 o 00:10 Piotr Zarzycki <[email protected]> napisał(a): > Carlos, > > I said that arrows will be a bead -> TabBarWithNavigationView (view is a > bead) - you can use that bead or not - up to you. > IMO - I don't know how implementation goes - I may not even commit that to > Royale. > > Yes - both points are exactly as you described. > > Thanks, > Piotr > > > On Tue, Oct 29, 2019, 8:04 PM Carlos Rovira <[email protected]> > wrote: > >> Hi Piotr, >> >> so the problems are 2. One (1) is you can't scroll though options in a >> TabBar with mouse wheel or touch in a screen. >> And second (2) one is: options that are partially visible in left or right >> doesn't move to show it entirely in viewport when you click over it. >> >> That's it? >> >> For 1), I saw the problem in BrowserStack, so this is something to be >> fixed >> >> for 2), I saw that behavior is implemented in material components. I'll >> try >> to bring in too as part of the usability enhancements. >> >> IMO, there's no need for another new component since both points will be >> in >> TabBar since are bugs or things not implemented. >> The left/right arrow buttons for me are optional and should be a bead for >> people that want to use it (for example in Material are not considered in >> default demo) >> >> IMHO, There is no reason to hate anything. >> >> Thanks >> >> >> >> >> El mar., 29 oct. 2019 a las 18:43, Piotr Zarzycki (< >> [email protected]>) escribió: >> >> > Windows 10, Chrome Version 78.0.3904.70 (Official Build) (64-bit) >> > >> > However it doesn't matter in MDL version it doesn't work as well. But >> > Royale version doesn't work also when I have some buttons invisible on >> > screen - It should scroll to next Tab when I click on the last one - Try >> > this in MDL version with small browser window. >> > >> > Click on the last visible button and it will scroll to the next one. >> > >> > I have started implementation of TabBar with navigation, cause I hate >> > current version and to me it's unusable totally. I hope I will end up >> with >> > something which will be usable in Royale. I'm going to implement >> > TabBarWithNavigationView or samething like that. [1] >> > >> > [1] https://stackoverflow.com/a/51681620/7353592 >> > >> > Thanks, >> > Piotr >> > >> > wt., 29 paź 2019 o 18:35 Carlos Rovira <[email protected]> >> > napisał(a): >> > >> > > Hi Piotr, >> > > >> > > can you provide your system info? SO, browsers tested? >> > > Thanks >> > > >> > > El mar., 29 oct. 2019 a las 17:57, Piotr Zarzycki (< >> > > [email protected]>) escribió: >> > > >> > > > Hi Carlos, >> > > > >> > > > FYI: On my system this pointer positioning doesn't work. I cannot >> use >> > > this >> > > > scrollbar which you are showing in GiF. >> > > > >> > > > Thanks, >> > > > Piotr >> > > > >> > > > czw., 24 paź 2019 o 19:42 Carlos Rovira <[email protected]> >> > > > napisał(a): >> > > > >> > > > > Hi Piotr, >> > > > > >> > > > > mouse scroll depends on pointer positioning. See next animated gif >> > [1] >> > > > > if you put your mouse pointer (or touch with finger in a touch >> > screen) >> > > > > inside tabor all should work >> > > > > If not maybe is something related to Microsoft IE or Edge (I'm on >> Mac >> > > and >> > > > > is the only browser without testing) >> > > > > >> > > > > For MDL, the main tabbar of that page has that behavior >> > > > > Material components has one too here [2] >> > > > > >> > > > > >> > > > > [1] https://imgur.com/a/li4pmBu >> > > > > [2] >> > > > > >> > > > > >> > > > >> > > >> > >> https://material-components.github.io/material-components-web-catalog/#/component/tabs >> > > > > >> > > > > >> > > > > El jue., 24 oct. 2019 a las 16:38, Piotr Zarzycki (< >> > > > > [email protected]>) escribió: >> > > > > >> > > > > > This is what I'm seeing GiF. I'm using mouse wheel and the only >> > thing >> > > > > which >> > > > > > is happen is that I'm scrolling whole page. [1]. >> > > > > > >> > > > > > What page contains TabBar with scroller in MDL ? >> > > > > > >> > > > > > [1] https://ibb.co/6Xt51NY >> > > > > > >> > > > > > czw., 24 paź 2019 o 16:28 Carlos Rovira < >> [email protected]> >> > > > > > napisał(a): >> > > > > > >> > > > > > > Hi Piotr, >> > > > > > > that output is right. No scrollbars visible. >> > > > > > > You should be able to scroll with the mouse wheel >> > > > > > > How do you scroll in MDL tabs [1]? >> > > > > > > >> > > > > > > thanks >> > > > > > > >> > > > > > > [1] https://getmdl.io/components/index.html >> > > > > > > >> > > > > > > El jue., 24 oct. 2019 a las 16:15, Piotr Zarzycki (< >> > > > > > > [email protected]>) escribió: >> > > > > > > >> > > > > > > > Hi Carlos, >> > > > > > > > >> > > > > > > > I just get back to this. If it's not visible how are you >> using >> > > it? >> > > > > Here >> > > > > > > is >> > > > > > > > the screenshot on my Chrome - I don't see scrollbar and it >> > > doesn't >> > > > > work >> > > > > > > at >> > > > > > > > all. [1] >> > > > > > > > >> > > > > > > > Describe please or provide some short gif where are you >> using >> > it. >> > > > > > > > >> > > > > > > > [1] https://ibb.co/3kzYm6h >> > > > > > > > >> > > > > > > > Thanks, >> > > > > > > > Piotr >> > > > > > > > >> > > > > > > > pt., 18 paź 2019 o 11:32 Carlos Rovira < >> > [email protected]> >> > > > > > > > napisał(a): >> > > > > > > > >> > > > > > > > > Hi Piotr, >> > > > > > > > > just tested for Safari, Firefox and Chrome (I'm on Mac). >> And >> > > all >> > > > > > seems >> > > > > > > > > fine. There's scroll but without showing scrollbars like >> in >> > MDL >> > > > > one. >> > > > > > > This >> > > > > > > > > always was the same. >> > > > > > > > > I have an issue in iOS where the scrollbar appears, but >> since >> > > > > current >> > > > > > > iOS >> > > > > > > > > Safari version (13), this issue has gone (it's only on >> iOS12 >> > > and >> > > > > > > previous >> > > > > > > > > versions) >> > > > > > > > > >> > > > > > > > > El jue., 17 oct. 2019 a las 11:07, Piotr Zarzycki (< >> > > > > > > > > [email protected]>) escribió: >> > > > > > > > > >> > > > > > > > > > Hi Carlos, >> > > > > > > > > > >> > > > > > > > > > We have noticed that in tour de jewel Tabbar example >> where >> > it >> > > > > > should >> > > > > > > > > > contains scroll doesn't have it anymore. [1] - Can you >> > check >> > > > what >> > > > > > has >> > > > > > > > > > happened if you found time? >> > > > > > > > > > >> > > > > > > > > > [1] *https://royale.apache.org/tourdejewel/ >> > > > > > > > > > <https://royale.apache.org/tourdejewel/>* >> > > > > > > > > > >> > > > > > > > > > Thanks, >> > > > > > > > > > -- >> > > > > > > > > > >> > > > > > > > > > Piotr Zarzycki >> > > > > > > > > > >> > > > > > > > > > Patreon: *https://www.patreon.com/piotrzarzycki >> > > > > > > > > > <https://www.patreon.com/piotrzarzycki>* >> > > > > > > > > > >> > > > > > > > > >> > > > > > > > > >> > > > > > > > > -- >> > > > > > > > > Carlos Rovira >> > > > > > > > > http://about.me/carlosrovira >> > > > > > > > > >> > > > > > > > >> > > > > > > > >> > > > > > > > -- >> > > > > > > > >> > > > > > > > Piotr Zarzycki >> > > > > > > > >> > > > > > > > Patreon: *https://www.patreon.com/piotrzarzycki >> > > > > > > > <https://www.patreon.com/piotrzarzycki>* >> > > > > > > > >> > > > > > > >> > > > > > > >> > > > > > > -- >> > > > > > > Carlos Rovira >> > > > > > > http://about.me/carlosrovira >> > > > > > > >> > > > > > >> > > > > > >> > > > > > -- >> > > > > > >> > > > > > Piotr Zarzycki >> > > > > > >> > > > > > Patreon: *https://www.patreon.com/piotrzarzycki >> > > > > > <https://www.patreon.com/piotrzarzycki>* >> > > > > > >> > > > > >> > > > > >> > > > > -- >> > > > > Carlos Rovira >> > > > > http://about.me/carlosrovira >> > > > > >> > > > >> > > > >> > > > -- >> > > > >> > > > Piotr Zarzycki >> > > > >> > > > Patreon: *https://www.patreon.com/piotrzarzycki >> > > > <https://www.patreon.com/piotrzarzycki>* >> > > > >> > > >> > > >> > > -- >> > > Carlos Rovira >> > > http://about.me/carlosrovira >> > > >> > >> > >> > -- >> > >> > Piotr Zarzycki >> > >> > Patreon: *https://www.patreon.com/piotrzarzycki >> > <https://www.patreon.com/piotrzarzycki>* >> > >> >> >> -- >> Carlos Rovira >> http://about.me/carlosrovira >> > -- Piotr Zarzycki Patreon: *https://www.patreon.com/piotrzarzycki <https://www.patreon.com/piotrzarzycki>*
