I am creating an android app with the above design in mind. I have made a custom action bar and stuck that to the onCreateOptionsMenu in my MainActivity.
getSupportActionBar().setDisplayOptions(ActionBar.DISPLAY_SHOW_CUSTOM);
getSupportActionBar().setCustomView(R.layout.action_bar);
I have also created a fixed footer in my MainActivity which is basically the imageviews for triggering different fragments in the app. Now these imageviews are set to wrap_content for their heights.
My questions are -
How do I restrict the size of my fragments so it sticks to the fixed viewgroup at the bottom as it does not have a specific height?
Is this the best approach to implementing such a design where there is a fixed footer to swap between fragments?
How to create and add a re-usable UI component similar to something like a google card where I can push in data from the server and include those dynamically in the scrollview.
Thank you.
Edit 1
activity_main -
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:id="#+id/mainActivity"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context="dd.MainActivity" >
<!-- Footer aligned to bottom -->
<LinearLayout
android:id="#+id/llFooterPlaceholder"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:orientation="vertical" >
<View
android:layout_width="fill_parent"
android:layout_height="3dp"
android:background="#color/green" />
<LinearLayout
android:id="#+id/llFooterMenu"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#color/bottom_bar"
android:orientation="horizontal" >
<ImageView
android:id="#+id/iv1"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="20"
android:scaleType="fitCenter"
android:src="#drawable/state_definition_iv1" />
<ImageView
android:id="#+id/iv2"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="20"
android:scaleType="fitCenter"
android:src="#drawable/state_definition_iv2" />
<ImageView
android:id="#+id/iv3"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="20"
android:background="#color/green"
android:scaleType="center"
android:src="#drawable/state_definition_iv3" />
<ImageView
android:id="#+id/iv4"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="20"
android:scaleType="fitCenter"
android:src="#drawable/state_definition_iv4" />
<ImageView
android:id="#+id/iv5"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="20"
android:scaleType="fitCenter"
android:src="#drawable/state_definition_iv5" />
</LinearLayout>
</LinearLayout>
<!-- Scrollable item above footer -->
<ScrollView
android:id="#+id/svContent"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_above="#id/llFooterPlaceholder"
android:layout_alignParentTop="true" >
<!-- Inflate the contents of the ScrollView dynamicaly -->
</ScrollView>
</RelativeLayout>
fragment1 which is activated onClick of iv1 of the footer (layout not complete yet) -
<?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="wrap_content"
android:orientation="vertical" >
<LinearLayout
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="30"
android:background="#444"
android:orientation="horizontal"
android:padding="#dimen/item_padding" >
<ImageView
android:id="#+id/ivAvtar"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="30"
android:background="#000"
android:scaleType="fitCenter" />
<LinearLayout
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="50"
android:background="#fff"
android:orientation="vertical" >
<TextView
android:id="#+id/tvUsername"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="50"
android:background="#0ff"
android:text="Username"
android:textColor="#color/green"
android:textStyle="bold" />
<TextView
android:id="#+id/tvImageTitle"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="50"
android:background="#ff0"
android:text="Title"
android:textColor="#color/orange"
android:textStyle="italic" />
</LinearLayout>
<TextView
android:id="#+id/tvTimestamp"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="20"
android:gravity="center"
android:text="Timestamp"
android:textColor="#color/green"
android:textStyle="bold" />
</LinearLayout>
<ImageView
android:id="#+id/ivImage"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="60"
android:background="#999"
android:padding="#dimen/item_padding"
android:scaleType="fitCenter" />
<LinearLayout
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="10"
android:background="#EEE"
android:orientation="horizontal" >
<LinearLayout
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="80"
android:background="#000"
android:orientation="horizontal" >
</LinearLayout>
<ImageView
android:id="#+id/ivShare"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="20"
android:background="#ddd"
android:padding="#dimen/item_padding"
android:scaleType="fitCenter" />
</LinearLayout>
</LinearLayout>
Change your ScrollView height from fill_parent to wrap_content. Because android:layout_height="fill_parent" your ScrollView come over your llFooterPlaceholder
like this
<ScrollView
android:id="#+id/svContent"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_above="#id/llFooterPlaceholder"
android:layout_alignParentTop="true" >
<!-- Inflate the contents of the ScrollView dynamicaly -->
</ScrollView>
Related
is the view which I have designed with the following code of xml
<LinearLayout
android:orientation="horizontal"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="0.8"
android:weightSum="3">
<RelativeLayout
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="1">
....
</RelativeLayout>
<RelativeLayout
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="1"
>
<ImageView
android:layout_width="84dp"
android:layout_height="84dp"
android:layout_centerInParent="true"
android:layout_above="#+id/meal_ln"
android:background="#drawable/meal_img_bg_ac"
app:layout_aspectRatio="100%"
/>
<TextView
android:id="#+id/meal_ln"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="Lunch"
android:textAlignment="center"
android:textColor="#color/priTxtLight"
android:layout_alignParentBottom="true"
android:paddingTop="4dp"
android:paddingBottom="4dp"
android:fontFamily="casual"/>
</RelativeLayout>
<RelativeLayout
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="1">
....
</RelativeLayout>
</LinearLayout>
My target is to design . And for this I added
<RelativeLayout
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="1"
android:scaleX="1.6"
android:scaleY="1.6"
>
in the second one which result in view cut as
How can I correct this issue?
I want to scale the middle view bigger than other two. In this both the image and text should be visible and should be bigger.
Problem which I found is: Linear layout is hiding the content of overflowing relative layout.
Try using LinearLayout with orientation vertical instead of RelativeLayout
<LinearLayout
android:orientation="horizontal"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="0.8"
android:weightSum="3">
<RelativeLayout
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="1">
....
</RelativeLayout>
<LinearLayout
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="1"
android:orientation="vertical"
>
<ImageView
android:layout_width="84dp"
android:layout_height="84dp"
android:layout_centerInParent="true"
android:layout_above="#+id/meal_ln"
android:background="#drawable/meal_img_bg_ac"
app:layout_aspectRatio="100%"
/>
<TextView
android:id="#+id/meal_ln"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="Lunch"
android:textAlignment="center"
android:textColor="#color/priTxtLight"
android:paddingTop="4dp"
android:paddingBottom="4dp"
android:fontFamily="casual"/>
</LinearLayout>
<LinearLayout
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="1">
....
</LinearLayout>
</LinearLayout>
I would like to create layout that looks like this:
Layout1and Layout2 are some layouts of any kind, nested in a parent LinearLayout. The LinearLayout is necessary to give both child layouts a 50% height by using layout_weight.
The red squares should be Buttons which overlap both Layout1and Layout2 and are centered between the two layouts.
Of course this could achived by using RelativeLayout as parent instead but then I would loose the possibility to use layout_weight...
If I keep using LinearLayout, it seems to be impossible to let the buttons overlap the two other layouts.
Furthermore the buttons cannot be siblings of the two layouts but need to be nested inside a common container layout that takes care of the horizontal positioning (e.g. a LinearLayout with horizontal orientation).
Any idea how to solve this?
I already tried to place the buttons inside Layout1 (or Layout2), place them below the bottom and use android:clipChildren=false, but this had no effect. The button where simple cut in half.
Edit:
Splitting the height between the two layouts 50/50 is just one version. Another view uses the same basic layout but splits the height 70/30 between the two layouts. The buttons should always be centered between the two layouts. Sorry for not pointing this out earlier.
Layout Code:
<!-- parent/root layout -->
<LinearLayout
...
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
... >
<!-- Layout1 -->
<LinearLayout
android:layout_weight="1"
... />
<!-- Buttons -->
<LinearLayout
android:orientation="horizontal"
... >
<Button ... />
<Button ... />
<Button ... />
</LinearLayout>
<!-- Layout2 -->
<LinearLayout
android:layout_weight="1"
... />
</LinearLayout>
50% linearOne 50% linearTwo
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/activity_test"
android:layout_width="match_parent"
android:layout_height="match_parent">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1"
android:background="#color/colorAccent">
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1"
android:background="#color/colorPrimary">
</LinearLayout>
</LinearLayout>
<LinearLayout
android:layout_centerInParent="true"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<View
android:layout_weight="1"
android:layout_width="50dp"
android:layout_height="50dp"
/>
<View
android:layout_weight="1"
android:layout_width="50dp"
android:layout_height="50dp"
android:background="#000" />
<View
android:layout_weight="1"
android:layout_width="50dp"
android:layout_height="50dp"
/>
<View
android:layout_weight="1"
android:layout_width="50dp"
android:layout_height="50dp"
android:background="#000" />
<View
android:layout_weight="1"
android:layout_width="50dp"
android:layout_height="50dp"
/>
<View
android:layout_weight="1"
android:layout_width="50dp"
android:layout_height="50dp"
android:background="#000" />
<View
android:layout_weight="1"
android:layout_width="50dp"
android:layout_height="50dp"
/>
</LinearLayout>
</RelativeLayout>
============================================================================
70% linearOne 30% linearTwo
Just close your eyes Copy and paste
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:id="#+id/activity_main"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
android:weightSum="10"
tools:context="com.ncrypted.myapplication.MainActivity">
<LinearLayout
android:layout_weight="6"
android:id="#+id/linear1"
android:layout_width="match_parent"
android:layout_height="0dp"
android:background="#color/colorAccent"
android:orientation="vertical">
</LinearLayout>
<RelativeLayout
android:layout_weight="2"
android:id="#+id/relative1"
android:layout_width="match_parent"
android:layout_height="0dp"
android:background="#color/colorAccent">
<LinearLayout
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="match_parent">
<View
android:layout_width="match_parent"
android:layout_height="0dp"
android:background="#color/colorAccent"
android:layout_weight="1" />
<View
android:layout_width="match_parent"
android:layout_height="0dp"
android:background="#color/colorPrimary"
android:layout_weight="1" />
</LinearLayout>
<LinearLayout
android:layout_centerInParent="true"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<View
android:layout_weight="1"
android:layout_width="50dp"
android:layout_height="50dp"
/>
<View
android:layout_weight="1"
android:layout_width="50dp"
android:layout_height="50dp"
android:background="#000" />
<View
android:layout_weight="1"
android:layout_width="50dp"
android:layout_height="50dp"
/>
<View
android:layout_weight="1"
android:layout_width="50dp"
android:layout_height="50dp"
android:background="#000" />
<View
android:layout_weight="1"
android:layout_width="50dp"
android:layout_height="50dp"
/>
<View
android:layout_weight="1"
android:layout_width="50dp"
android:layout_height="50dp"
android:background="#000" />
<View
android:layout_weight="1"
android:layout_width="50dp"
android:layout_height="50dp"
/>
</LinearLayout>
</RelativeLayout>
<LinearLayout
android:layout_weight="2"
android:id="#+id/linear2"
android:layout_width="match_parent"
android:layout_height="0dp"
android:background="#color/colorPrimary"
android:orientation="vertical">
</LinearLayout>
</LinearLayout>
Hm, if you don't have any restrictions besides those ones that you've described in the question, you could do it by the next way:
<!-- parent/root layout -->
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
<LinearLayout
...
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
... >
<!-- Layout1 -->
<LinearLayout
android:layout_weight="1"
... />
<!-- Layout2 -->
<LinearLayout
android:layout_weight="1"
... />
</LinearLayout>
<!-- Buttons -->
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_centerVertical="true"
android:orientation="horizontal"
android:background="#android:color/transparent"
... >
<Button ... />
<Button ... />
<Button ... />
</LinearLayout>
</RelativeLayout>
Here, this is the solution using only Linearlayout.
Key point is: button is consist of two part. Half top and Half bottom. And minus margin means half of your button's height.
But, please do not use this code. Use GuideLine of ConstraintLayout. It has percentage option, so you can implement almost evert layout you want.
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/activity_test"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_weight="0.5"
android:background="#d3d3d3">
<ImageView
android:id="#+id/imageView1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="bottom"
android:layout_marginBottom="-25dp"
android:layout_weight="1"
android:src="#mipmap/ic_launcher"/>
<ImageView
android:id="#+id/imageView2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="bottom"
android:layout_marginBottom="-25dp"
android:layout_weight="1"
android:src="#mipmap/ic_launcher"/>
<ImageView
android:id="#+id/imageView3"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="bottom"
android:layout_marginBottom="-25dp"
android:layout_weight="1"
android:src="#mipmap/ic_launcher"/>
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_weight="0.5"
android:background="#Ed1c24">
<ImageView
android:id="#+id/imageView4"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="top"
android:layout_marginTop="-25dp"
android:layout_weight="1"
android:src="#mipmap/ic_launcher"/>
<ImageView
android:id="#+id/imageView5"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="top"
android:layout_marginTop="-25dp"
android:layout_weight="1"
android:src="#mipmap/ic_launcher"/>
<ImageView
android:id="#+id/imageView6"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="top"
android:layout_marginTop="-25dp"
android:layout_weight="1"
android:src="#mipmap/ic_launcher"/>
</LinearLayout>
</LinearLayout>
Here you can use this:
Position the imageviews according to your requirement
<RelativeLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:id="#+id/activity_test"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#e2e2"
android:layout_weight="1"
>
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#Ed1c24"
android:layout_weight="1"
>
</LinearLayout>
</LinearLayout>
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#mipmap/ic_launcher"
android:id="#+id/imageView"
android:layout_marginStart="48dp"
android:layout_centerVertical="true"
/>
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#mipmap/ic_launcher"
android:id="#+id/imageView1"
android:layout_toEndOf="#+id/imageView"
android:layout_marginStart="48dp"
android:layout_centerVertical="true"
/>
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#mipmap/ic_launcher"
android:id="#+id/imageView3"
android:layout_toEndOf="#+id/imageView1"
android:layout_marginStart="38dp"
android:layout_centerVertical="true"
/>
</RelativeLayout>
I am trying to make a scroll view. I have a text field in my app and when I open the keyboard, the entire screen shifts up and I want to make it scroll so I could see what's going up there.
My scroll view has a text field and some image views to show up on the screen.
<ScrollView
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:scrollbars="vertical"
android:fillViewport="true"
android:id="#+id/scrollView2" >
<LinearLayout
android:orientation="vertical"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:minHeight="570dp">
<LinearLayout
android:orientation="horizontal"
android:layout_width="fill_parent"
android:layout_height="60dp"
android:layout_marginTop="30dp">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textAppearance="?android:attr/textAppearanceMedium"
android:text="Total Lives :"
android:id="#+id/textView12"
android:layout_marginTop="8dp"
android:layout_marginLeft="20dp" />
<ImageView
android:layout_width="40dp"
android:layout_height="40dp"
android:id="#+id/lifeImage1"
android:src="#drawable/full_brain_game" />
<ImageView
android:layout_width="40dp"
android:layout_height="40dp"
android:id="#+id/lifeImage2"
android:src="#drawable/full_brain_game" />
<ImageView
android:layout_width="40dp"
android:layout_height="40dp"
android:id="#+id/lifeImage3"
android:src="#drawable/full_brain_game" />
<ImageView
android:layout_width="40dp"
android:layout_height="40dp"
android:id="#+id/lifeImage4"
android:src="#drawable/full_brain_game" />
<ImageView
android:layout_width="40dp"
android:layout_height="40dp"
android:id="#+id/lifeImage5"
android:src="#drawable/full_brain_game" />
<ImageView
android:layout_width="40dp"
android:layout_height="40dp"
android:id="#+id/lifeImage6"
android:src="#drawable/full_brain_game" />
</LinearLayout>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textAppearance="?android:attr/textAppearanceMedium"
android:id="#+id/textView7"
android:layout_marginLeft="150dp"
android:textColor="#color/red"
android:layout_marginTop="150dp" />
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/imageView"
android:src="#drawable/full_brain_game_1" />
</LinearLayout>
</ScrollView>
Change ScrollView child as RelativeLayout as follows and add Linear Layout inside RelativeLayout:
<ScrollView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fillViewport="true" >
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical">
<ImageView
android:layout_width="match_parent"
android:layout_height="wrap_content" />
<ImageView
android:layout_width="match_parent"
android:layout_height="wrap_content" />
</LinearLayout>
</RelativeLayout>
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:orientation="vertical">
<ScrollView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fillViewport="true">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center">
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center"
android:textStyle="bold"
android:id="#+id/txtsignup"
android:text="Register Here"
android:textSize="30dp"
android:padding="10dp"/>
</LinearLayout>
</LinearLayout>
</ScrollView>
</LinearLayout>
Try this, and keep adding your views in the Linear Layout.
first of all you need to Set your ScrollView's height and width to match_parent then the height of your linearLayout must be match_parent too. then everything gonna be okay.
I ran into an issue concerning two ImageViews which are displayed on the layout.xml but not when running the app.
<?xml version="1.0" encoding="utf-8"?>
<!-- Outter Linear Layout -->
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:id="#+id/linearOutter"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
android:background="#e6e6e9" >
<!-- First inner Linear Layout -->
<LinearLayout
android:id="#+id/linearInner1"
android:layout_width="fill_parent"
android:layout_height="0dp"
android:layout_weight="0.18"
android:paddingLeft="16dp"
android:paddingRight="16dp"
android:orientation="horizontal" >
<ImageView
android:id="#+id/moyland_logo"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_weight="0.5"
android:gravity="center"
android:src="#drawable/moyland" />
<ImageView
android:id="#+id/hsrw_logo"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_weight="0.5"
android:gravity="center"
android:src="#drawable/hsrw" />
</LinearLayout>
<!-- Title -->
<org.hsrw.artandcycle.util.AutoResizeTextView
android:id="#+id/widget37"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="0.1"
android:fontFamily="sans-serif-thin"
android:gravity="center"
android:text="#string/app_name_upper"
android:textAppearance="?android:attr/textAppearanceLarge"
android:textColor="#0C1273"
android:maxLines="1"
android:textSize="100sp" />
<!-- Second inner Linear Layout -->
<LinearLayout
android:id="#+id/linearInner2"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="0.18"
android:paddingLeft="16dp"
android:paddingRight="16dp"
android:orientation="horizontal" >
<ImageView
android:id="#+id/gelderland_logo"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_weight="0.5"
android:gravity="center"
android:src="#drawable/erfgoed_gelderland" />
<ImageView
android:id="#+id/interreg_logo"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_weight="0.5"
android:gravity="center"
android:src="#drawable/interreg" />
</LinearLayout>
<!-- Third inner Linear Layout -->
<LinearLayout
android:id="#+id/linearInner3"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="0.18"
android:orientation="horizontal"
android:paddingLeft="16dp"
android:paddingRight="16dp" >
<ImageView
android:id="#+id/erw_logo"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_weight="0.5"
android:gravity="center"
android:src="#drawable/erw" />
<ImageView
android:id="#+id/gelderland2_logo"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_weight="0.5"
android:gravity="center"
android:src="#drawable/province_gelderland" />
</LinearLayout>
<ImageView
android:id="#+id/foerder_logo"
android:layout_width="fill_parent"
android:layout_height="0dp"
android:layout_weight="0.18"
android:paddingLeft="16dp"
android:paddingRight="16dp"
android:gravity="center"
android:src="#drawable/foerder" />
<ImageView
android:id="#+id/wfg_logo"
android:layout_width="fill_parent"
android:layout_height="0dp"
android:layout_weight="0.18"
android:paddingLeft="16dp"
android:paddingRight="16dp"
android:gravity="center"
android:src="#drawable/wfg" />
</LinearLayout>
This is my layout. Everything is displayed as it is supposed to be but the last two image views are not displayed on my Galaxy Nexus.
What did I do wrong?
The problem was the dimension of the last two images.
I reduced the width of those images to 800. Before the width was about 1300 pixels.
I have made a custom theme to display my image buttons on the action bar. I was wondering how I can center these buttons vertically in android.
The code I have written so far.
<?xml version="1.0" encoding="utf-8"?>
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="horizontal" >
<ImageButton
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="top|left|center_vertical"
android:background="#drawable/groups" />
<ImageButton
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="top|center|fill_vertical"
android:background="#drawable/contactlist" />
<ImageButton
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="top|right|center_vertical"
android:background="#drawable/favourites" />
</FrameLayout>
This is what I want
// try this
<?xml version="1.0" encoding="utf-8"?>
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="horizontal" >
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content">
<LinearLayout
android:layout_width="0dp"
android:layout_height="wrap_content"
android:gravity="center"
android:background="#android:color/holo_blue_dark"
android:padding="5dp"
android:layout_weight="1">
<ImageButton
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#drawable/groups" />
</LinearLayout>
<View
android:layout_width="1dp"
android:layout_height="match_parent"
android:background="#android:color/white"/>
<LinearLayout
android:layout_width="0dp"
android:layout_height="wrap_content"
android:gravity="center"
android:background="#android:color/holo_blue_dark"
android:padding="5dp"
android:layout_weight="1">
<ImageButton
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#drawable/contactlist" />
</LinearLayout>
<View
android:layout_width="1dp"
android:layout_height="match_parent"
android:background="#android:color/white"/>
<LinearLayout
android:layout_width="0dp"
android:layout_height="wrap_content"
android:gravity="center"
android:background="#android:color/holo_blue_dark"
android:padding="5dp"
android:layout_weight="1">
<ImageButton
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#drawable/favourites" />
</LinearLayout>
</LinearLayout>
</FrameLayout>
Please follow this code.
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="match_parent"
android:orientation="horizontal" >
<ImageButton
android:layout_width="0dip"
android:layout_height="50dip"
android:layout_gravity="top|left|center_vertical"
android:layout_weight="1"
android:background="#FE6602" />
<ImageButton
android:layout_width="0dip"
android:layout_height="50dip"
android:layout_gravity="top|center|fill_vertical"
android:layout_weight="1"
android:background="#DBEAF9" />
<ImageButton
android:layout_width="0dip"
android:layout_height="50dip"
android:layout_gravity="top|right|center_vertical"
android:layout_weight="1"
android:background="#FAF2B0" />
</LinearLayout>
Changes:
android:layout_height="50dip" to android:layout_height="wrap_content"
android:background="#FE6602" to android:background="#drawable/contactlist"
I just put simple color and static size or testing purpose work like charm.
You can put the image buttons inside a LinearLayout with vertical orientation, and then set their gravity to android:layout_gravity="center"