Design Login and Register page using android tabs

Question

I want to design a login and register layout using android tabs. Image is as shown below. how do i proceed enter image description here

You can proceed by doing this: "File -> New -> Android Project" — Reno, Mar 26 '12 at 07:40

score 2 · Answer 1 · answered Mar 26 '12 at 06:15

I think you can use FrameLayout to do it in a simple way, managing the visualization when you user press "Register" or "Login".

Something like that:

TabRow with two buttons those have the same weight (and a selector of different colors to manage differents state)
FrameLayout with two children: one for the registration section and one to allow user to login

score 2 · Accepted Answer · answered Mar 26 '12 at 06:26

I would use the Android API Support Library and the sample FragmentTabsPager located at http://developer.android.com/resources/samples/Support4Demos/src/com/example/android/supportv4/app/FragmentTabsPager.html

You would have two tabs, corresponding to two Fragments that you could name RegisterFragment and LoginFragment.

Basically you would remove the lines

    mTabsAdapter.addTab(mTabHost.newTabSpec("simple").setIndicator("Simple"),
            FragmentStackSupport.CountingFragment.class, null);
    mTabsAdapter.addTab(mTabHost.newTabSpec("contacts").setIndicator("Contacts"),
            LoaderCursorSupport.CursorLoaderListFragment.class, null);
    mTabsAdapter.addTab(mTabHost.newTabSpec("custom").setIndicator("Custom"),
            LoaderCustomSupport.AppListFragment.class, null);
    mTabsAdapter.addTab(mTabHost.newTabSpec("throttle").setIndicator("Throttle"),
            LoaderThrottleSupport.ThrottledLoaderListFragment.class, null);

and replace them with

    mTabsAdapter.addTab(mTabHost.newTabSpec("register").setIndicator("Register"),
           RegisterFragment.class, null);
    mTabsAdapter.addTab(mTabHost.newTabSpec("login").setIndicator("Login"),
           LoginFragment.class, null);

Then you implement those Fragments and integrate this code into your Activity. You'll also need to integrate the fragment_tabs_pager.xml layout into your layout.

Hi louie, activity part is right.. how can i change tab colors? default color is gray and black. i want to change it to blue.. layout color i could change — sush, Mar 26 '12 at 06:53
To style your tabs, please take a look at http://stackoverflow.com/questions/4127446/custom-style-for-androids-tabwidget — louielouie, Mar 26 '12 at 06:56

Design Login and Register page using android tabs

2 Answers2