Nacho Ramos Sánchez
Reputation: 584
Android - TextView pushing up Imageview
I have some linear layouts containing some texts with images below them. Everything is fine until my text splits into 2 lines because of the lack of space. My image is being pushed up by the text, and I want to avoid that, but I can't achieve it.
Here's my XML code:
<?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:orientation="vertical" 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:id="@+id/imagen_entorno"
android:layout_width="match_parent"
android:layout_height="170dp"
android:orientation="vertical"
android:background="@android:color/black">
</LinearLayout>
<ScrollView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#123456"
android:layout_gravity="center"
android:layout_below="@id/imagen_entorno"
android:overScrollMode="never"
android:paddingBottom="75dp">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
android:id="@+id/linearRoot"
android:layout_marginTop="12dp"
>
<LinearLayout
android:id="@+id/linear1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:weightSum="3"
android:orientation="horizontal"
android:gravity="center_vertical"
android:layout_gravity="center"
android:layout_marginBottom="5dp">
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="vertical">
<ImageButton
android:id="@+id/boton1"
android:layout_width="@dimen/botones_sonidos"
android:layout_height="@dimen/botones_sonidos"
android:layout_weight="1"
android:layout_marginBottom="2dp"
android:layout_marginLeft="10dp"
android:layout_marginRight="10dp"
/>
<TextView
android:id="@+id/tituloSonido1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Pajaro"
android:layout_gravity="center"
android:textColor="@color/white"
fontPath="fonts/helveticalight.ttf"
tools:ignore="MissingPrefix"/>
</LinearLayout>
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="vertical">
<ImageButton
android:id="@+id/boton2"
android:layout_width="@dimen/botones_sonidos"
android:layout_height="@dimen/botones_sonidos"
android:layout_weight="1"
android:layout_marginBottom="2dp"
android:layout_marginLeft="10dp"
android:layout_marginRight="10dp"
/>
<TextView
android:id="@+id/tituloSonido2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Pajaro"
android:layout_gravity="center"
android:textColor="@color/white"
fontPath="fonts/helveticalight.ttf"
tools:ignore="MissingPrefix"/>
</LinearLayout>
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="vertical">
<ImageButton
android:id="@+id/boton3"
android:layout_width="@dimen/botones_sonidos"
android:layout_height="@dimen/botones_sonidos"
android:layout_weight="1"
android:layout_marginBottom="2dp"
android:layout_marginLeft="10dp"
android:layout_marginRight="10dp"
/>
<TextView
android:id="@+id/tituloSonido3"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Pajaro"
android:layout_gravity="center"
android:textColor="@color/white"
fontPath="fonts/helveticalight.ttf"
tools:ignore="MissingPrefix"/>
</LinearLayout>
</LinearLayout>
<LinearLayout
android:id="@+id/linear2"
android:layout_below="@id/linear1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:weightSum="3"
android:orientation="horizontal"
android:gravity="center_vertical"
android:layout_gravity="center">
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="vertical">
<ImageButton
android:id="@+id/boton4"
android:layout_width="@dimen/botones_sonidos"
android:layout_height="@dimen/botones_sonidos"
android:layout_weight="1"
android:layout_marginBottom="2dp"
android:layout_marginLeft="10dp"
android:layout_marginRight="10dp"
/>
<TextView
android:id="@+id/tituloSonido4"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="Pajaro mas largo aun"
android:singleLine="false"
android:lines="2"
android:layout_below="@id/boton4"
android:gravity="center"
android:textColor="@color/white"
fontPath="fonts/helveticalight.ttf"
tools:ignore="MissingPrefix"/>
</LinearLayout>
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="vertical">
<ImageButton
android:id="@+id/boton5"
android:layout_width="@dimen/botones_sonidos"
android:layout_height="@dimen/botones_sonidos"
android:layout_weight="1"
android:layout_marginBottom="2dp"
android:layout_marginLeft="10dp"
android:layout_marginRight="10dp"
/>
<TextView
android:id="@+id/tituloSonido5"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="Pajaro"
android:gravity="center"
android:textColor="@color/white"
fontPath="fonts/helveticalight.ttf"
tools:ignore="MissingPrefix"/>
</LinearLayout>
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="vertical">
<ImageButton
android:id="@+id/boton6"
android:layout_width="@dimen/botones_sonidos"
android:layout_height="@dimen/botones_sonidos"
android:layout_weight="1"
android:layout_marginBottom="2dp"
android:layout_marginLeft="10dp"
android:layout_marginRight="10dp"
/>
<TextView
android:id="@+id/tituloSonido6"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="Pajaro"
android:gravity="center"
android:textColor="@color/white"
fontPath="fonts/helveticalight.ttf"
tools:ignore="MissingPrefix"/>
</LinearLayout>
</LinearLayout>
<LinearLayout
android:id="@+id/linear3"
android:layout_below="@id/linear1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:weightSum="3"
android:orientation="horizontal"
android:gravity="center_vertical"
android:layout_gravity="center">
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="vertical">
<ImageButton
android:id="@+id/boton7"
android:layout_width="@dimen/botones_sonidos"
android:layout_height="@dimen/botones_sonidos"
android:layout_weight="1"
android:layout_marginBottom="2dp"
android:layout_marginLeft="10dp"
android:layout_marginRight="10dp"
/>
<TextView
android:id="@+id/tituloSonido7"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="Pajaro"
android:singleLine="false"
android:lines="2"
android:layout_below="@id/boton4"
android:gravity="center"
android:textColor="@color/white"
fontPath="fonts/helveticalight.ttf"
tools:ignore="MissingPrefix"/>
</LinearLayout>
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="vertical">
<ImageButton
android:id="@+id/boton8"
android:layout_width="@dimen/botones_sonidos"
android:layout_height="@dimen/botones_sonidos"
android:layout_weight="1"
android:layout_marginBottom="2dp"
android:layout_marginLeft="10dp"
android:layout_marginRight="10dp"
/>
<TextView
android:id="@+id/tituloSonido8"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="Pajaro"
android:gravity="center"
android:textColor="@color/white"
fontPath="fonts/helveticalight.ttf"
tools:ignore="MissingPrefix"/>
</LinearLayout>
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="vertical">
<ImageButton
android:id="@+id/boton9"
android:layout_width="@dimen/botones_sonidos"
android:layout_height="@dimen/botones_sonidos"
android:layout_weight="1"
android:layout_marginBottom="2dp"
android:layout_marginLeft="10dp"
android:layout_marginRight="10dp"
/>
<TextView
android:id="@+id/tituloSonido9"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="Pajaro"
android:gravity="center"
android:textColor="@color/white"
fontPath="fonts/helveticalight.ttf"
tools:ignore="MissingPrefix"/>
</LinearLayout>
</LinearLayout>
</LinearLayout>
</ScrollView>
</LinearLayout>
Screenshot of the problem:
Any tip is appreciated :)
Upvotes: 1
Views: 322
Answers (6)
Burak Karasoy
Reputation: 1690
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
weight_sum="4"
android:orientation="vertical">
<ImageButton
android:id="@+id/boton2"
android:layout_width="@dimen/botones_sonidos"
android:layout_height="0dp"
android:layout_weight="3"
android:layout_marginBottom="2dp"
android:layout_marginLeft="10dp"
android:layout_marginRight="10dp"
/>
<TextView
android:id="@+id/tituloSonido2"
android:layout_width="wrap_content"
android:layout_height="0dp"
android:layout_weight="1"
android:text="Pajaro"
android:layout_gravity="center"
android:textColor="@color/white"
fontPath="fonts/helveticalight.ttf"
tools:ignore="MissingPrefix"/>
</LinearLayout>
avoid using wrap_content in order to get fix size views. You can add a weight_sum property to LinearLayout and assign a value for example 4. Add layout_weight properties to sub views as well.Assign 3 to imaveView and 1 for textview now imageview always will be bigger than textview 3times and textview can not invade imagevies's space. ofc you can assign different values to them to get different size views as you wish.
Upvotes: 1
Hello World
Reputation: 2774
Replace your layout with
<?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:orientation="vertical" 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:id="@+id/imagen_entorno"
android:layout_width="match_parent"
android:layout_height="170dp"
android:orientation="vertical"
android:background="@android:color/black">
</LinearLayout>
<ScrollView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#123456"
android:layout_gravity="center"
android:layout_below="@id/imagen_entorno"
android:overScrollMode="never"
android:paddingBottom="75dp">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
android:id="@+id/linearRoot"
android:layout_marginTop="12dp"
>
<LinearLayout
android:id="@+id/linear1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:weightSum="3"
android:orientation="horizontal"
android:gravity="center_vertical"
android:layout_gravity="center"
android:layout_marginBottom="5dp">
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="top"
android:orientation="vertical">
<ImageButton
android:id="@+id/boton1"
android:layout_width="@dimen/botones_sonidos"
android:layout_height="@dimen/botones_sonidos"
android:layout_weight="1"
android:layout_marginBottom="2dp"
android:layout_marginLeft="10dp"
android:layout_marginRight="10dp"
/>
<TextView
android:id="@+id/tituloSonido1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Pajaro"
android:layout_gravity="center"
android:textColor="@color/white"
fontPath="fonts/helveticalight.ttf"
tools:ignore="MissingPrefix"/>
</LinearLayout>
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="top"
android:orientation="vertical">
<ImageButton
android:id="@+id/boton2"
android:layout_width="@dimen/botones_sonidos"
android:layout_height="@dimen/botones_sonidos"
android:layout_weight="1"
android:layout_marginBottom="2dp"
android:layout_marginLeft="10dp"
android:layout_marginRight="10dp"
/>
<TextView
android:id="@+id/tituloSonido2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Pajaro"
android:layout_gravity="center"
android:textColor="@color/white"
fontPath="fonts/helveticalight.ttf"
tools:ignore="MissingPrefix"/>
</LinearLayout>
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="vertical">
<ImageButton
android:id="@+id/boton3"
android:layout_width="@dimen/botones_sonidos"
android:layout_height="@dimen/botones_sonidos"
android:layout_gravity="top"
android:layout_weight="1"
android:layout_marginBottom="2dp"
android:layout_marginLeft="10dp"
android:layout_marginRight="10dp"
/>
<TextView
android:id="@+id/tituloSonido3"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Pajaro"
android:layout_gravity="center"
android:textColor="@color/white"
fontPath="fonts/helveticalight.ttf"
tools:ignore="MissingPrefix"/>
</LinearLayout>
</LinearLayout>
<LinearLayout
android:id="@+id/linear2"
android:layout_below="@id/linear1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:weightSum="3"
android:orientation="horizontal"
android:gravity="center_vertical"
android:layout_gravity="center">
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="top"
android:orientation="vertical">
<ImageButton
android:id="@+id/boton4"
android:layout_width="@dimen/botones_sonidos"
android:layout_height="@dimen/botones_sonidos"
android:layout_weight="1"
android:layout_marginBottom="2dp"
android:layout_marginLeft="10dp"
android:layout_marginRight="10dp"
/>
<TextView
android:id="@+id/tituloSonido4"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="Pajaro mas largo aun"
android:singleLine="false"
android:lines="2"
android:layout_below="@id/boton4"
android:gravity="center"
android:textColor="@color/white"
fontPath="fonts/helveticalight.ttf"
tools:ignore="MissingPrefix"/>
</LinearLayout>
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="top"
android:orientation="vertical">
<ImageButton
android:id="@+id/boton5"
android:layout_width="@dimen/botones_sonidos"
android:layout_height="@dimen/botones_sonidos"
android:layout_weight="1"
android:layout_marginBottom="2dp"
android:layout_marginLeft="10dp"
android:layout_marginRight="10dp"
/>
<TextView
android:id="@+id/tituloSonido5"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="Pajaro"
android:gravity="center"
android:textColor="@color/white"
fontPath="fonts/helveticalight.ttf"
tools:ignore="MissingPrefix"/>
</LinearLayout>
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="top"
android:orientation="vertical">
<ImageButton
android:id="@+id/boton6"
android:layout_width="@dimen/botones_sonidos"
android:layout_height="@dimen/botones_sonidos"
android:layout_weight="1"
android:layout_marginBottom="2dp"
android:layout_marginLeft="10dp"
android:layout_marginRight="10dp"
/>
<TextView
android:id="@+id/tituloSonido6"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="Pajaro"
android:gravity="center"
android:textColor="@color/white"
fontPath="fonts/helveticalight.ttf"
tools:ignore="MissingPrefix"/>
</LinearLayout>
</LinearLayout>
<LinearLayout
android:id="@+id/linear3"
android:layout_below="@id/linear1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:weightSum="3"
android:orientation="horizontal"
android:gravity="center_vertical"
android:layout_gravity="center">
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="vertical">
<ImageButton
android:id="@+id/boton7"
android:layout_width="@dimen/botones_sonidos"
android:layout_height="@dimen/botones_sonidos"
android:layout_weight="1"
android:layout_marginBottom="2dp"
android:layout_marginLeft="10dp"
android:layout_marginRight="10dp"
/>
<TextView
android:id="@+id/tituloSonido7"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="Pajaro"
android:singleLine="false"
android:lines="2"
android:layout_below="@id/boton4"
android:gravity="center"
android:textColor="@color/white"
fontPath="fonts/helveticalight.ttf"
tools:ignore="MissingPrefix"/>
</LinearLayout>
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="vertical">
<ImageButton
android:id="@+id/boton8"
android:layout_width="@dimen/botones_sonidos"
android:layout_height="@dimen/botones_sonidos"
android:layout_weight="1"
android:layout_marginBottom="2dp"
android:layout_marginLeft="10dp"
android:layout_marginRight="10dp"
/>
<TextView
android:id="@+id/tituloSonido8"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="Pajaro"
android:gravity="center"
android:textColor="@color/white"
fontPath="fonts/helveticalight.ttf"
tools:ignore="MissingPrefix"/>
</LinearLayout>
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="vertical">
<ImageButton
android:id="@+id/boton9"
android:layout_width="@dimen/botones_sonidos"
android:layout_height="@dimen/botones_sonidos"
android:layout_weight="1"
android:layout_marginBottom="2dp"
android:layout_marginLeft="10dp"
android:layout_marginRight="10dp"
/>
<TextView
android:id="@+id/tituloSonido9"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="Pajaro"
android:gravity="center"
android:textColor="@color/white"
fontPath="fonts/helveticalight.ttf"
tools:ignore="MissingPrefix"/>
</LinearLayout>
</LinearLayout>
</LinearLayout>
</ScrollView>
</LinearLayout>
Upvotes: 1
Linh
Reputation: 60973
The solution for make your my image is being pushed up by the text is fix the height for all TextView by set layout_height
android:layout_height="30dp"
or set the lines
android:lines="1" // or 2,3 ....
If you just want to keep the image where it is when the line splits into 2 or more lines. you need to use GridView
Upvotes: 1
Haris Aftab
Reputation: 259
If any of the textView can drop to two lines because of lack of space instead of fixing the height set lines to 2 for each textView and apply gravity center. It will intact all text views with respect to height.
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:lines="2"
android:text="test"
android:gravity="center"/>
Upvotes: 1
Daniel Zolnai
Reputation: 16910
Just fixate the height of that TextView:
<TextView
android:id="@+id/tituloSonido3"
android:layout_width="wrap_content"
android:layout_height="48dp"
...
/>
If you want only one line, you can ellipsize it and set a smaller size. If you want multiple, you can use an increased height.
Upvotes: 0
Related Questions
- How to change fontFamily of TextView in Android
- How can I close/hide the Android soft keyboard programmatically?
- How to stop EditText from gaining focus when an activity starts in Android?
- Proper use cases for Android UserManager.isUserAGoat()?
- Why is the Android emulator so slow? How can we speed up the Android emulator?
- How to make links in a TextView clickable
- How do I center text horizontally and vertically in a TextView?
- Is there a unique Android device ID?
- How to put a border around an Android TextView?
- Making TextView scrollable on Android