In the demo Support4Demos - API 4+ Support Demos , the Tabs and TabsPager examples both extend FragmentActivity. Each tab content is itself a Fragment. No real breakthrough, TabActivity was used the same way without the introduction of Fragment.
Now suppose inside my Activity , a screen portion is a Fragment named WidgetFragment. How is it possible for WidgetFragment to contain a TabHost ? Visualize a mini TabHost contained inside an Activity.
I tried every possible way to insert a TabHost inside a Fragment not a FragmentActivity.
In generally accepted practices, Tabs fit the whole screen.
Most people (including me) are unaware the tabs can be placed anywhere like a simple view, ListView.
The trick is to include your TabHost inside another layout. When you create the TabHost, always keep these id : tabhost , tabs , tabcontent
In your main layout, include your tabhost.xml . Here I center the TabHost in the middle
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="vertical">
<!-- Fill whatever you need -->
<FrameLayout
android:id="#+id/widget_fragment"
android:layout_centerVertical="true" android:layout_centerHorizontal="true"
android:layout_height="wrap_content"
android:layout_width="wrap_content">
<include layout="#layout/tabhost" />
</FrameLayout>
</LinearLayout>
Look well at the Tabs and TabsPager examples in Support4Demos , the TabHost is still managed by FragmentActivity. Each tab content is a fragment. With TabActivity, it may not be possible to have a tab anywhere
At the end, this is what it looks like
Related
I have a layout in my head that should look like that: http://i.imgur.com/H1nTRvd.png
Only part that will be dynamic is the blue one. I don't know the number of tabs that will be created before I load the activity, hence the number is acquired from server (could be either 5 or 24 for all I know).
The bottom buttons should not move when I swipe and the blue area changed.
Currently I have this implemented w/o tabs list using embedded fragment in my activity and gesture listener. There's no good looking transaction animation between fragments.
#Nick Pakhomov: You can use PagerTabStrip
PagerTabStrip
is intended to be used as a child view of a ViewPager widget in your XML layout. PagerTabStrip is most often used with fragment, which is a convenient way to supply and manage the Lifecycle of each fragment.
So here’s how a ViewPager with a PagerTabStrip in it would look like in the layout file:
<android.support.v4.view.ViewPager xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/pager"
android:layout_width="match_parent"
android:layout_height="match_parent">
<android.support.v4.view.PagerTabStrip
android:id="#+id/pager_tab_strip"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="top"
android:background="#33b5e5"
android:textColor="#fff"
/>
</android.support.v4.view.ViewPager>
Please check this PagerSlidingTabStrip demo . I hope it will helps you .
I want to develope screen like the below..which contains two tabs with right alignment!
actually it's the dynamic screen and top part should be fixed with two tabs when ever they click the tabs it's different fragment. please suggest me the best way.
You can use ViewPager for this.
<android.support.v4.view.ViewPager
android:id="#+id/vpPager"
android:layout_width="match_parent"
android:layout_height="wrap_content">
</android.support.v4.view.ViewPager>
Here is a link for your reference.
Design two different layout files and switch them on Tabchange.
You can either use RadioGroup to act like tabs with fragments
like this https://stackoverflow.com/a/17541555/3020568
OR you can use PagerSlidingTabStrip library and customize it like the way you want
https://github.com/astuetz/PagerSlidingTabStrip
So here is my problem and Question
I have a Header and Footer layout in a Main.xml and its FragmentActivity is Main.java.
Now this header and footer is common across all activities in my application as shown by Image.
https://www.dropbox.com/s/pgox67k33u0zxct/device-2013-10-23-002417.png
So to solve this problem i used Fragments as Shown in Figure Main.java Fragment A is inside Main.xml . Now this all works fine Fragment A is showing header and footer of Main.xml
Problem starts when i start an activity from Fragment A it totally opens in a New Window full screen . My understanding was if i start an Activity from Fragment A then this Activity will only take place of Fragment A . I hope you understand my question .
Re-using Layouts with <include/>
Define your Header and Footer layout
and use that like
<include layout="#layout/header"/>
and
<include layout="#layout/footer"/>
e.g
<include
android:layout_width="fill_parent"
android:layout_height="wrap_content"
layout="#layout/header" />
Go through Android Document
http://developer.android.com/training/improving-layouts/reusing-layouts.html
Why are you using activities in such case?
It seems that fragments would be more convenient for this type of problem especially since you want that header/footer are used from Parent activity.
so you would have in your xml:
header
framelayout (this would be replaced by fragment within activity)
footer
Each of the fragments have its own lifecycle and parent activity as well.
You can find example of this in Android documentation:
http://developer.android.com/guide/components/fragments.html
I am developing an applications that is aimed at Tablets and Google TVs. It will be like many standard Google TV applications with a LeftNavBar and a top Search bar that is common to all application screens. It will look something like the following image:
Main Screen
The RED area will be different for all other screens. It may contain data like following screens mockups:
Activity One loaded into main container
Activity Two loaded into main container
So you can see that completely different sections can be loaded in the main area.
Screen 3 can be loaded as a detailed section when selecting any list item in Screen 2 (say in fragment list) OR it can be loaded as a result of selecting a tab (which will appear in LeftNavBar).
Here is how I am trying to implement it.
Step 1. I Created a main Activity with the following XML:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical" >
<LinearLayout
android:layout_width="match_parent"
android:layout_height="50dp"
android:background="#9ccc" >
<!-- Top Bar -->
</LinearLayout>
<FrameLayout
android:id="#+id/mainContainer"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1">
<!-- main Red Container that will load other Activities -->
</FrameLayout>
</LinearLayout>
mainContainer is the RED container where I want to load the Activities. LeftNavBar will be added to this Activity as its the parent of All.
Step 2 I created ActivityOne & ActivityTwo with two & three Fragments in them respectively (as shown in above second & third image).
*Step 3 I am trying to load the ActivityOne in main page's mainContainer FrameLayout... But I cannot add it.
I tried by adding the ActivityOne to mainContainer as follows:
View v = (new ActivityOne()).getWindow().getDecorView();
FrameLayout mainContainer = (FrameLayout) findViewById(R.id.mainContainer);
mainContainer.addView(v);
but the getWindow() returns null....
Other issue occurs because all the data comes from a remote services .. so please also suggest how would I be able to hold references to all the loaded Activities in mainContainer in a some kind of stack ... so I can just reload the already loaded activity instead of creating its new instance.. This will be used on BACK button press.
OR
Instead of loading an activity into the above RED container, I should create two Activities each with their own Fragments & a LeftNavBar. This might be easier than the aforementioned approach. or this might be the only solution.... however I feel that saving state for BACK buttons might get messy .. but I will try implementing this
What would you do if you had to create this type of application?
How would you design the UI layout for best performance/practice?
Your suggestions in helping me setting this app's layout are much appreciated.
Disclaimer
This is where fragments can get tricky. The problem would be simple if Activity 1 & 2 had identical layouts so that you could simply attach/detach fragments and use the fragment back stack to unwind.
Because you want 2 unique layouts to house your fragments, things are going to be a little more involved. If at all possible I would try to use the same layout so that you can take the easy path.
As another option, you could use two activities as you outline above and send data back and forth with Intents.
That said, if I really had to implement this solution as written, here is what I would do. Note that I am not advocating this solution but myself do not know of a better way of doing things.
The Solution
Create a FragmentActivity whose view would be Main Screen as you've defined above. The layout for the Main Screen would contain:
Left nav bar
Top bar
2 layouts. layout1 and layout2. These would be contained in a parent layout i.e. RelativeLayout or LinearLayout and would contain the necessary FrameLayout elements for your fragments.
Example using your XML (note, tags are a bit brief):
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical" >
<LinearLayout
android:layout_width="match_parent"
android:layout_height="50dp"
android:background="#9ccc" >
<!-- Top Bar -->
</LinearLayout>
<LinearLayout android:id="#+id/layout1">
<FrameLayout android:id="#+id/listFragment" />
<FrameLayout android:id="#+id/contentFragment" />
</LinearLayout>
<LinearLayout android:id="#+id/layout2">
<FrameLayout android:id="#+id/imageFragment" />
<FrameLayout android:id="#+id/boxFragment1" />
<FrameLayout android:id="#+id/boxFragment2" />
<FrameLayout android:id="#+id/boxFragment3" />
</LinearLayout>
</LinearLayout>
The main idea is that you then show/hide layout1 & layout2 i.e. set android:visibility="gone" based on the state of your app.
The disadvantages of this method are:
Using fragment backstack may be impossible, instead you'll have to track where the user is in your UI flow and manage the back button to show/hide layout
You may need to take special care to attach/detach fragments when you show/hide their parent view to reduce resource consumption while the fragments are invisible
The advantages are:
Easy communication between fragments and the base activity since only 1 activity is used
Re: The nested Fragments problem
To get around the 'nested Fragments' problem in our application where (as you correctly note) Fragments cannot add Fragments I hosted a single templating Fragment under the activity whose only purpose was to define a set of place holders for other fragments to anchor to. When adding further Fragments to the activity past this point I used the templating Fragment's view place holder +#ids to identify the "root" or parent view Id for the Fragment being added.
getSupportFragmentManager().beginTransaction().add(#someIdFromTheTemplateFrag, fragment, fragmentTag).commit();
The Fragment I was adding then knew where to anchor itself in the current layout and of course then went about it's merry way of add it's view. This had the effect of attaching a Fragment to another Fragment hence achieving the desired visual 'nesting'...
I am designing tabs in my app. I am confused whether to use activities for tab or just use views
which one is the better way for tablayout
I am confused ..
I am bit new to tabs and still learning tab layout in android, so my question can be a little naive so please bear with it :)
To answer your question of "activity or view in a tab layout"
This is what the android tutorial sais:
You can implement your tab content in one of two ways: use the tabs
to swap Views within the same Activity, or use the tabs to change
between entirely separate activities. Which method you want for your
application will depend on your demands, but if each tab provides a
distinct user activity, then it probably makes sense to use a separate
Activity for each tab, so that you can better manage the application
in discrete groups, rather than one massive application and layout.
Android tablayout tutorial
I highly recommend following the tutorial, then try to implement your own version for your app.
Here is a code sample just in case;
public class TabHostExample extends TabActivity {
#Override
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.testtabs);
TabHost tabHost = getTabHost();
TabHost.TabSpec spec;
Intent content;
spec = tabHost.newTabSpec("test1"); //set a title for the tab
spec.setIndicator("test1"),
getResources().getDrawable(R.drawable.ic_dialog_alert)); //set an icon for tab
content = new Intent(this, ExampleActivityOne.class);
spec.setContent(content);
tabHost.addTab(spec);
spec = tabHost.newTabSpec("test2")); //set a title for the tab
spec.setIndicator("test2"),
getResources().getDrawable(R.drawable.ic_dialog_info)); //set an icon for the tab
content = new Intent(this, ExampleActivityTwo.class);
spec.setContent(content);
tabHost.addTab(spec);
tabHost.setCurrentTab(0);
}
}
<TabHost
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:id="#android:id/tabhost">
<LinearLayout
android:orientation="vertical"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
>
<TabWidget
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:id="#android:id/tabs"
/>
<FrameLayout
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:id="#android:id/tabcontent"
/>
</LinearLayout>
</TabHost>
A bit of extra information from the tutorial:
The framelayout is where the content of the activity per tab goes.
Notice that the TabWidget and the FrameLayout elements have the IDs tabs and tabcontent, respectively. These names must be used so that the TabHost can retrieve references to each of them. It expects exactly these names.
So with this code you have a basic setup for a tab layout, what you do next is, attach an activity to a tab. You use the activity like normal, for these activities you extend Activity as you normally would for an activity and build your layout in onCreate/onResume
If you need more information or more explanation please leave a comment. I think most code is self explanatory though.
I just noticed my code is almost an exact copy from the tutorial page.
I actually use this code in my app, with different names for the activities etc. It works great. I recommend it. Credits goes to the Android team.
You have to use activities. Every tab has activity. There are good tutorials at developer.android.com Try this one here
Try Activities..Look for TabActivity which is best way to deal the TABS in an App.. http://developer.android.com/reference/android/app/TabActivity.html and http://developer.android.com/resources/tutorials/views/hello-tabwidget.html