0

I have a layout with 4 buttons in the center. I simply want to add a textview next to the four buttons (WITHOUT MOVING THE FOUR BUTTONS FROM THE CENTER), like illustrated here (TextView should be in the place of the red) :

[![enter image description here][1]][1]

Right now, I have the textview in its own linear layout and the four buttons in their own Relative Layout, all in one big relative layout. When ever I try to move the textview to the left of the buttons, the buttons move over to the right. How do I achieve what I illustrated? Here is my XML:

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout 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"
    android:paddingBottom="@dimen/activity_vertical_margin"
    android:paddingLeft="@dimen/activity_horizontal_margin"
    android:paddingRight="@dimen/activity_horizontal_margin"
    android:paddingTop="@dimen/activity_vertical_margin"
    tools:context="com.example.ruchir.circleswithmap.MainActivity"
    android:id="@+id/layout"
    android:gravity="center"
    android:background="#010101">

    <LinearLayout
        android:id="@+id/text_container"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_above="@+id/relativeLayout"
        android:layout_centerHorizontal="true"
        android:layout_marginBottom="10dp"
        >


        <TextView

            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:text="20:00"
            android:textAppearance="?android:attr/textAppearanceLarge"
            android:textSize="50sp"
            android:textColor="#fbfafa"

            android:id="@+id/timetext" />


    </LinearLayout>

    <RelativeLayout
        android:id="@+id/relativeLayout"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_centerInParent="true">

    <ImageButton
        android:layout_width="150dp"
        android:layout_height="150dp"
        android:id="@+id/Blue"
        android:layout_alignParentTop="true"
        android:layout_alignParentLeft="true"
        android:layout_alignParentStart="true"
        android:background="@drawable/bluesquare" />

    <ImageButton
        android:layout_width="150dp"
        android:layout_height="150dp"
        android:id="@+id/Green"
        android:layout_below="@+id/Blue"
        android:layout_alignLeft="@+id/Blue"
        android:layout_alignStart="@+id/Blue"
        android:background="@drawable/greensquare" />

    <ImageButton
        android:layout_width="150dp"
        android:layout_height="150dp"
        android:id="@+id/Red"
        android:layout_alignTop="@+id/Blue"
        android:layout_toRightOf="@+id/Blue"
        android:layout_toEndOf="@+id/Blue"
        android:background="@drawable/redsquare" />

    <ImageButton
        android:layout_width="150dp"
        android:layout_height="150dp"
        android:id="@+id/Purple"
        android:layout_alignBottom="@+id/Green"
        android:layout_alignLeft="@+id/Red"
        android:layout_alignStart="@+id/Red"
        android:background="@drawable/purplesquare" />

</RelativeLayout>

    </RelativeLayout>
RobinHood
  • 10,897
  • 4
  • 48
  • 97
  • @PiyushGupta I have explained why not a duplicate –  Dec 15 '15 at 10:37
  • Does your `TextView` really need its dimensions `match_parent`? Have your tried setting it to `wrap_content`? Also, why does your `TextView` needs to be wrapped in a `LinearLayout`? Have you removed the `layout_above` property when you try to move it? – yennsarah Dec 15 '15 at 10:42
  • @Amy No, I don't need it to be `match_parent`, but just put that so that it takes up the space of the LinearLayout. What do you suggest I do? Thanks so much –  Dec 15 '15 at 10:44
  • But your `LinearLayout` wraps around your `TextView` which tells the `LinearLayout` it wants to be as big as possible - I assume Android gets confused. If you don't need the LinearLayout, move the relevant properties to your `TextView` and set its `width` and `height` to `wrap_content`. – yennsarah Dec 15 '15 at 10:47
  • i have solution but can't put as anwer.!! – Kishore Jethava Dec 15 '15 at 11:02
  • @bigdestroyer has already solved your problem on the other question, but you want that he solves all your problems and does all your project... – Sapikelio Dec 15 '15 at 11:13
  • @kishorejethava You can answer it here http://stackoverflow.com/questions/34265041/add-textview-to-layout – Héctor Dec 15 '15 at 11:15
  • @kishorejethava Yes, you have a solution! Just answer it on this link: http://stackoverflow.com/questions/34265041/add-textview-to-layout **Thanks!** –  Dec 16 '15 at 06:01
  • i have posted check it. – Kishore Jethava Dec 16 '15 at 07:06

1 Answers1

-1

Put the textView in one Linearlayout and the four buttons in another LinearLayout and then trying Horizontal weights to align then in a single line might work out.

Code could be as follows

<?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"
    android:paddingBottom="@dimen/activity_vertical_margin"
    android:paddingLeft="@dimen/activity_horizontal_margin"
    android:paddingRight="@dimen/activity_horizontal_margin"
    android:paddingTop="@dimen/activity_vertical_margin"
    tools:context="com.example.ruchir.circleswithmap.MainActivity"
    android:id="@+id/layout"
    android:gravity="center"
    android:background="#010101"
    android:weightSum="100">

    <LinearLayout
        android:id="@+id/text_container"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_above="@+id/relativeLayout"
        android:layout_centerHorizontal="true"
        android:layout_marginBottom="10dp"
        android:layout_weight = "50"
        >


        <TextView

            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:text="20:00"
            android:textAppearance="?android:attr/textAppearanceLarge"
            android:textSize="50sp"
            android:textColor="#fbfafa"

            android:id="@+id/timetext" />


    </LinearLayout>

    <RelativeLayout
        android:id="@+id/relativeLayout"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_centerInParent="true"
        android:layout_weight="50">

        <ImageButton
            android:layout_width="150dp"
            android:layout_height="150dp"
            android:id="@+id/Blue"
            android:layout_alignParentTop="true"
            android:layout_alignParentLeft="true"
            android:layout_alignParentStart="true"
             />

        <ImageButton
            android:layout_width="150dp"
            android:layout_height="150dp"
            android:id="@+id/Green"
            android:layout_below="@+id/Blue"
            android:layout_alignLeft="@+id/Blue"
            android:layout_alignStart="@+id/Blue"
             />

        <ImageButton
            android:layout_width="150dp"
            android:layout_height="150dp"
            android:id="@+id/Red"
            android:layout_alignTop="@+id/Blue"
            android:layout_toRightOf="@+id/Blue"
            android:layout_toEndOf="@+id/Blue"
             />

        <ImageButton
            android:layout_width="150dp"
            android:layout_height="150dp"
            android:id="@+id/Purple"
            android:layout_alignBottom="@+id/Green"
            android:layout_alignLeft="@+id/Red"
            android:layout_alignStart="@+id/Red"
             />

    </RelativeLayout>

</LinearLayout>
  • How would I do that? I'm slightly confused on what you're suggesting...Can you provide an example? –  Dec 15 '15 at 10:37
  • Check out the edit and see if it helps. – George Jacob Dec 15 '15 at 10:49
  • 1
    I would not recommend this way of nested Layouts - especially `LinearLayout` with nested `weights` often lead to performance and other problems, as stated [here](http://stackoverflow.com/questions/9430764/why-are-nested-weights-bad-for-performance-alternatives). – yennsarah Dec 15 '15 at 10:51
  • I've made an edit with no additional LinearLayouts. And a single global weight. Will this create the same performance issues? – George Jacob Dec 15 '15 at 22:20
  • Great, it works!! How did you do it though? I was trying for 4 hours, and I couldn't get it. How did you get the layout like that? –  Dec 16 '15 at 06:04
  • Ill accept your answer and like your answer once you tell me (+25 rep) –  Dec 16 '15 at 06:09
  • It's not much really. All that it does it provide a singular weight for the initial layout, to be shared with the children of the same. So the initial layout has a total weight of 100, and the 2 child layouts share the given weight. That is all. – George Jacob Dec 17 '15 at 07:03