TabHost - aligned bottom, disabled and showing no view - android

I know this is a bit odd but bear with me.
I have a custom view, that extends TabHost and inflates a XML.
It includes several views, it is aligned to bottom and everything works great.
The problem is when I put the TabHost in a different activity, where I don't want to see any of the TabHost views. Only the TabHost tabs on top of the activity layout. Basically, I want the TabHost to be there as a disabled bottom bar.
here's the TabHost XML (which works great and aligned to bottom, as long as I toggle between one of the custom views):
<?xml version="1.0" encoding="utf-8"?>
<TabHost xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/tabhost"
android:layout_width="match_parent"
android:layout_height="match_parent" >
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical" >
<FrameLayout
android:id="#android:id/tabcontent"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_weight="1"
>
<CustomView#1
android:id="#+id/tab_watch_me"
android:layout_width="match_parent"
android:layout_height="match_parent" />
<CustomView#2
android:id="#+id/tab_messages"
android:layout_width="match_parent"
android:layout_height="match_parent" />
<CustomView#3
android:id="#+id/tab_search_results"
android:layout_width="match_parent"
android:layout_height="match_parent" />
<CustomView#4
android:id="#+id/tab_my_profile"
android:layout_width="match_parent"
android:layout_height="match_parent" />
<CustomView#5
android:id="#+id/tab_user_profile"
android:layout_width="match_parent"
android:layout_height="match_parent" />
</FrameLayout>
<TabWidget
android:id="#android:id/tabs"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_weight="0" />
</LinearLayout>
</TabHost>
Here's the activity XML (the one that I don't want the tabhost views to be shown, only to align the tabhost buttons to the bottom):
<?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" >
<customview.HeaderView
android:id="#+id/header_view"
android:layout_width="match_parent"
android:layout_height="wrap_content" />
**//Notice that I don't want to show any of the customViews the tabhost hold. only the tabhost tabs/buttons**
<customview.MyTabHost
android:id="#+id/settings_tabhost"
android:layout_width="match_parent"
android:layout_height="match_parent" />
</LinearLayout>
Let me know if you need more code in order to help!
Thank you!

My RelativeLayout solution in case this helps anyone. I'm still looking for a better solution if anyone has to offer.
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical" >
<customview.HeaderView
android:id="#+id/header_view"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentTop="true" />
<Any other view
android:layout_below="#+id/header_view"
/>
<customview.MyTabHost
android:id="#+id/settings_tabhost"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_alignParentBottom="true" />
</RelativeLayout>

Related

Problems placing view on top of SlidingPaneLayout

I want to place a view via include on top of a SlidingPaneLayout. In the layout preview of AndroĆ­d Studio it is displayed correctly but on my device the view won't show - why?
Here is the complete layout file:
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent">
<include layout="#layout/online_state"
android:layout_height="5dp"
android:layout_width="wrap_content"/>
<android.support.v4.widget.SlidingPaneLayout
android:id="#+id/content_view_spl"
android:layout_width="match_parent"
android:layout_height="match_parent" >
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="?attr/color_background_primary"
android:orientation="vertical" >
<de.timroes.android.listview.EnhancedListView
android:id="#+id/list"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:background="?attr/color_background_primary"
android:divider="#color/black"
android:dividerHeight="1dp" />
</LinearLayout>
<LinearLayout
android:id="#+id/selected_item"
android:layout_width="fill_parent"
android:layout_height="match_parent"
android:layout_weight="1"
android:orientation="vertical" >
</LinearLayout>
</android.support.v4.widget.SlidingPaneLayout>
Ok, got it...
I have to place the SlidingPaneLayout below the view...
Stupid question... sorry ;)

Android Fragment doesn't show on Large Layout

I have created an application using Fragments to show List on the left and details on the right.
Following is my layout in layout-large Appointments.xaml
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="horizontal"
android:layout_width="fill_parent"
android:layout_height="fill_parent">
<include
android:id="#+id/cust_toolbar"
layout="#layout/tool_bar" />
<fragment
class="com.myapp.blue.Fragments.ListFragment"
android:id="#+id/frg_list"
android:layout_weight="1"
android:layout_width="0px"
android:layout_height="match_parent" />
<FrameLayout
android:id="#+id/frg_detail"
android:layout_weight="1"
android:layout_width="0px"
android:layout_height="match_parent" />
</LinearLayout>
And this is the Appointments.xaml from layout Folder
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"
android:background="#FFFFFFFF"
android:layout_width="fill_parent"
android:layout_height="fill_parent">
<include
android:id="#+id/cust_toolbar"
layout="#layout/tool_bar" />
<fragment
class="com.myapp.blue.Fragments.ListFragment"
android:id="#+id/frg_list"
android:layout_weight="1"
android:layout_width="fill_parent"
android:layout_height="fill_parent" />
</LinearLayout>
Here is the code for my Activity
public class AppointmentActivity : Activity
{
protected override void OnCreate(Bundle savedInstanceState)
{
base.OnCreate(savedInstanceState);
//Set Content
SetContentView(Resource.Layout.Appointments);
Toolbar toolbar = FindViewById<Toolbar>(Resource.Id.cust_toolbar);
//Set Action bar
SetActionBar(toolbar);
}
}
The application runs flawlessly on Mobiles but when I run this application with Tablets None of my fragments show. I followed the instructions on this Xamarin walkthrough and have seen other stackoverflow posts where they say that the width should be 0px or dp. But I cannot get the list fragment to show up on my Tablet. What am I missing here?
The problem is that the toolbar you include most likely has layout_width=match_parent, and as such occupies the entire linear layout with horizontal orientation. If you want your toolbar to be at the top, just make your linear layout vertical, and insert another horizontal linear layout inside with your fragments:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"
android:layout_width="fill_parent"
android:layout_height="fill_parent">
<include
android:id="#+id/cust_toolbar"
layout="#layout/tool_bar" />
<LinearLayout
android:orientation="horizontal"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1">
<fragment
class="com.myapp.blue.Fragments.ListFragment"
android:id="#+id/frg_list"
android:layout_weight="1"
android:layout_width="0px"
android:layout_height="match_parent" />
<FrameLayout
android:id="#+id/frg_detail"
android:layout_weight="1"
android:layout_width="0px"
android:layout_height="match_parent" />
</LinearLayout>
</LinearLayout>
Mention width property in dp like 200dp

Why upper part of this layout does not display?

Here is my layout. The problem is that either the PageViewer contents are visible and nothing else. If I see PageViewer to gone than I see everything above it. Also tried root layout as frame layout but it does not help. Main thing is only the view pager is visible. What I want is 2/3 ViewPager contents which contains data, and above some header material that is 1/3. I don't want to use weights as the upper part is already sized correctly. I just want to guarantee that both the top and pageviewer display properly. Is it a characteristic of pageviewers that they switch everything? or can they not be applied below another element?
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:orientation="vertical"
android:layout_height="match_parent" >
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/mHeaderHeader"
android:visibility="visible"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="vertical">
<include
android:id="#+id/myInclude"
layout="#layout/myInclude_layout" />
<include
android:id="#+id/myInclude2r"
layout="#layout/myInclude2" />
<FrameLayout
android:layout_width="fill_parent"
android:layout_height="wrap_content" >
</FrameLayout>
<include
android:id="#+id/myInclude3"
layout="#layout/myinclude3layout" />
<ImageView
android:id="#+id/myImageView"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
/>
</LinearLayout>
<android.support.v4.view.ViewPager
android:id="#+id/myViewPager"
android:visibility="visible"
android:layout_width="match_parent"
android:layout_height="wrap_content"
/>
<include layout="#layout/myinclude4" />
</LinearLayout>
You can try something like this:
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:orientation="vertical"
android:layout_height="match_parent" >
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/mHeaderHeader"
android:visibility="visible"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_alignParentTop="true"
android:orientation="vertical">
<include
android:id="#+id/myInclude"
layout="#layout/myInclude_layout" />
<include
android:id="#+id/myInclude2r"
layout="#layout/myInclude2" />
<include
android:id="#+id/myInclude3"
layout="#layout/myinclude3layout" />
<ImageView
android:id="#+id/myImageView"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
/>
</LinearLayout>
<include layout="#layout/myinclude4"
android:id="#+id/myinclude4" />
<android.support.v4.view.ViewPager
android:id="#+id/myViewPager"
android:visibility="visible"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignBelow="#id/mHeaderHeader"
android:layout_alignAbove="#id/myinclude4" />
</RelativeLayout>
I suppose that ViewPager takes all space, so I placed it below header and above footer using RelativeLayout

Android TABS with fragments

I've been working on a small project that consists of a GUI with a number of tabs. I'm quite new with the concept of fragments however it seems that they're a best practice within the android tab landscape. I managed to code a simple tab app, that switches between 3 tabs.
The only issue I have is when I try placing the tabs at the bottom of the screen. When they're at the bottom, the tab widget covers the container(framelayout in this case) and so nothing happens, the screen remains the same when clicking the various tabs.
The following XML layout represents the good version( where the tabs are at the top of the screen):
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"
android:layout_width="fill_parent"
android:layout_height="fill_parent">
<TabHost
android:id="#android:id/tabhost"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
>
<LinearLayout
android:orientation="vertical"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
>
<TabWidget
android:id="#android:id/tabs"
android:orientation="horizontal"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_weight="0"
/>
<FrameLayout
android:id="#android:id/tabcontent"
android:layout_width="0dp"
android:layout_height="0dp"
android:layout_weight="0"/>
<FrameLayout
android:id="#+android:id/realtabcontent"
android:layout_width="fill_parent"
android:layout_height="0dp"
android:layout_weight="1"/>
</LinearLayout>
</TabHost>
</LinearLayout>
The following XML layout represents the version that isn't working, when the tabs are at the bottom of the screen:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"
android:layout_width="fill_parent"
android:layout_height="fill_parent">
<TabHost
android:id="#android:id/tabhost"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
>
<RelativeLayout
android:orientation="vertical"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
>
<TabWidget
android:id="#android:id/tabs"
android:orientation="horizontal"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
/>
<FrameLayout
android:id="#android:id/tabcontent"
android:layout_width="0dp"
android:layout_height="0dp"
/>
<FrameLayout
android:id="#+android:id/realtabcontent"
android:layout_width="fill_parent"
android:layout_height="0dp"
/>
</RelativeLayout>
</TabHost>
</LinearLayout>
I changed the layour to relativelayout and added this command: android:layout_alignParentBottom="true" to the tabwidget. Does anyone have an alternative idea of how I can sort this issue? Thanks in advance.
In general using tabs at the bottom of the screen is a bad solution (see Android design guidelines).
For your solution: put TabWidget at the end of list of view. Because of drawing is a line process and fragments this your case are drowed upper TabWidget
You can use weight instead. Try this layout marking
<android.support.v4.app.FragmentTabHost xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#android:id/tabhost"
android:layout_width="match_parent"
android:layout_height="match_parent" >
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical" >
<FrameLayout
android:id="#android:id/tabcontent"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1" />
<TabWidget
android:id="#android:id/tabs"
android:layout_width="match_parent"
android:layout_height="wrap_content" />
</LinearLayout>
</android.support.v4.app.FragmentTabHost>
You can replace FragmentTabHost with own TabHost class. So, your tabs will be at the bottom of the screen.
Be careful with nested weights (they are bad for performance) and deeping in view hierarchy (especially for android < 4).

Is it possible to have a two level action bar?

I'm developing an Android app implementing the a tabhost, viewpager, and a top-side sliding drawer and tabs at the bottom. The application uses the android-support-v4 FragmentPagerAdapter, which can be found in the samples of the v4-support-package. A reference can be found here:
http://developer.android.com/reference/android/support/v4/app/FragmentPagerAdapter.html
I can't seem to get both the Sliding Drawer and the TabHost to appear on the screen at the same time.
Here is my layout. The com.mobicartel... block is a custom sliding drawer. -------------------------------------------------------------------------------------------
<RelativeLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:my="http://schemas.android.com/apk/res/com.mobicartel.tabsandpager"
android:id="#+id/activity_main"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical" >
<com.mobicartel.tabsandpager.slidingdrawer.MultiDirectionSlidingDrawer
xmlns:my="http://schemas.android.com/apk/res/com.mobicartel.tabsandpager"
android:id="#+id/drawer"
my:direction="topToBottom"
android:layout_width="match_parent"
android:layout_height="wrap_content"
my:handle="#+id/handle"
my:content="#+id/content">
<include
android:id="#id/content"
layout="#layout/pen_content" />
<ImageButton
android:id="#id/handle"
android:layout_width="wrap_content"
android:layout_height="40px"
android:src="#drawable/sliding_drawer_handle_bottom" />
</com.mobicartel.tabsandpager.slidingdrawer.MultiDirectionSlidingDrawer>
<FrameLayout
android:id="#+id/tab_host_container"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_below="#+id/drawer">
<TabHost
android:id="#android:id/tabhost"
android:layout_width="match_parent"
android:layout_height="match_parent">
<LinearLayout
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="match_parent">
<android.support.v4.view.ViewPager
android:id="#+id/pager"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1"/>
<FrameLayout
android:id="#android:id/tabcontent"
android:layout_width="0dp"
android:layout_height="0dp"
android:layout_weight="0"/>
<TabWidget
android:id="#android:id/tabs"
android:orientation="horizontal"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_weight="0"
android:layout_marginBottom="-4dip"/>
</LinearLayout>
</TabHost>
</FrameLayout>
The content of TabHost actually isn't being displayed. Instead, the tab listener & viewpager listener control each other so they are in sync. The ViewPager is populated with fragments by a special adapter.
Any ideas?
Does anybody
I've never used TabHost with tabs at the bottom, because it is advised against (in the official Design Guidelines), however, it appears that you are using the hack found here: https://stackoverflow.com/a/2710404/377260.
I notice that your FrameLayout weight is 0, along with the height and width. Try setting them to:
<FrameLayout
android:id="#android:id/tabcontent"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:padding="5dp"
android:layout_weight="1"/>
as found in the answer linked to.

Categories

Resources