Wix horizontal bar similar to tab component - mobile-website

I am new to Wix and to be honest kind of confused if there is a way to add a horizontal bar in my website.
So I have a multistate box with different states so when you press a button it takes you to that state.
What I want to do, is to somehow fit these buttons in the mobile version. I have seen that there are some components called tabs which could do the trick because they come with a default horizontal scroll bar or arrows when the content does not fit. Is there any alternative or an actual component I can add to my buttons and fix that issue?
Thank you in advance!

Related

Is it possible to move the tab bar to left and right direction in iPhone

Im developing a tabbar application.
There are almost 7 tabs in this app.
Usuall when we add more than 5 tabs a "more button"will come and rest of options will come under that "More option".
But i found a very interesting app in app store and they are moving the tabbar to left and right(just like we do in scroll view) like in the image below.
How can i implement this.
Can anyone help me with this please.
Thanks in advance.
As far as I can see, it's 2 custom UIButtons placed over the tabBar that may programmatically rearrange the tab options on their IBActions. What makes me say that is that the highlighted area of the last tab is just normal, and the arrows does not seem as well placed as what Apple could have done by standard.
You can use custom tabBar, like InfiniTabBar, nice and functional.
Project on GitHub:
https://github.com/iosdeveloper/InfiniTabBar

Sliding UITabBarItems in UITabBarController

I have a UITabBarController as my rootController with 8 UITabBarItems. and I want to show just 4 UITabBarItems in my screen. By default all my other tab bar items appear in a small tabBarItem called "More" and you can select the other 4. But I have seen some apps that implement a sliding UITabBarItems with a slide icon instead of a "More" icon.
How can I show just 4 at a moment, and I slide the TabBarItems, and so that I can select the other tab bar items ?
~ Something like this ~
And then I can slide to the next 4 sets by dragging
It would be helpful if someone could point me in the right direction.
There is a nifty little github project that could help you... check it out: https://github.com/iosdeveloper/InfiniTabBar
This is not currently a built-in option for UITabBarContoller.
One way to approach the problem is to add a UIGestureRecognizer to the tabBar.view, and programmatically adjust which 4 options are available on the screen. You can add an animation to make it smooth or have a little bounce as it slides.
iPhone users are usually very picky and attached to Apple's UI Guidelines. Although you can pass the Apple verification, you probably wont be able to pass users' (meaning bad reviews and ratings). So I recommend you to re-consider your tabbar structure and use "..." More instead of sliding it... You can always override stuff in code, but then they wont work smooth with InterfaceBuilder and in the end you will have more trouble than you'd expect.
If you have similar tab items merge them and use maybe a segmented control or something to visually distinguish them. Or use a central navigation screen in which you can put 9 maybe more icons in a grid...
The first solution to your problem may not always be the best way. Well, it is very rare actually...
You have to write a custom control for this.
I wrote one for showing a horizontal menu. You can probably modify that to fit your needs.
http://blog.mugunthkumar.com/coding/ios-control-mkhorizmenu/

Mobile Safari iPhone Development - Multiple buttons in a row

I'm an iPhone developer, but new to web development. I've done some basic HTML websites and made one in iWeb as well. I'm trying to branch out to mobile web development now, so I checked out Dashcode.
Anyway, I'm trying to put a Call Button, Mail Button, and Map Button in horizontal alignment. I realize that I can add a Column Layout and have two buttons in a row, but that's the most I've gotten.
Any ideas? Thanks!
Thomas
Edit: I still haven't figured this out yet. I was given advice about a fixed position button bar, but I am not sure how to implement it. I've been looking at code, but haven't gotten it yet. Still trying though. Any help is appreciated!
What i do usually is to select the element you can't align horizontally and then go to the inspector -> dimension tab and in disposition you select fixed absolute.
This should work but beware because if you've the intention to change element's place dynamically you may have some surprise...
I think you are looking for something like this.
A fixed position button bar is created with several buttons side by side.
/Mogens

Is it possible to detect a scrollbar release event in GWT?

I'm building a GWT app where I want to be able to detect when a user releases a scroll bar on one of my ScrollPanels.
My use case is that the horizontal scroll bar represents time. Since it's impossible to represent the full range of scrollable time I want to just represent a small window of time with the scroll bar. When the user moves and releases the scroll bar I want to do a smooth recentering where the new center is the release point.
I can work out how to do this by building a custom scroll bar widget, but I wanted to check if I was missing some way to do it using a "native" scroll bar first.
You might be able to do it with a ScrollPanel and implementing your own ScrollHandler. Just use the addScrollHandler() method and you should be able to override whatever functionality you need.
However, I would suggest that you re-think your approach. What you seem to really want is a slider control for time, that kind of looks like a scroll bar. You should check out the Composite class and the Widget Gallery to see if there is some combination of Widgets that would suit what you need more. Failing that, I'd also look at SmartGWT. They have a very extensive library of GUI Widgets available, and you may find something you can use already there.

Scrolling TabPanel

I Am trying to create a Tab Panel where I can add and delete tabs on demand.
Where I am getting stuck is that if a potential user adds too many tabs the new tabs go off the screen.
Each Tab is to contain a text area widget where a user may enter text.
Is there any way of horizontally scrolling the just the TabBar and not the whole browser window?
I could use a scroll panel but I was hoping to scrol just the Tabs, not the panel contents.
I cannot see any available method in the com.google.gwt.user.client.ui.TabPanel API that will perform this function and no real way to split the panel.
Help!
It's not what you've asked for, but you might consider using a StackPanel instead of a TabPanel, since if the user can enter a long list of items it's generally better to have vertical scrolling instead of horizontal scrolling.
The gwt TabPanel isn't the greatest, and there's not a real easy way to do what you want. You could take a look at the tab widget in Ext-GWT, which scrolls the tabs, but I don't think extjs is generally a good idea.
There's a bunch of new layout-based widgets arriving with GWT 2.0. Look at TabLayoutPanel. It places tabs in a very wide container inside a div with overflow=hidden. You might be able to add some controls to scroll that container and get the effect you want.
Good luck, and report back if you get something working. GWT really needs more widget contributors.