Android Layout- Part of TextView goes off edge of screen - android

I have a LinearLayout with a custom button and then another LinearLayout with two TextViews, which is always partly cut off on the edge of the screen. I have tried tons of different combinations of fill_parents, match_parents, and wrap_contents, as well as trying to add layout_weights, but nothing solved it, nor did any answer to any similar questions on this site. Here is my XML code, thanks for any help!
<?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="horizontal" >
<com.goldtrimdevelopment.sites.google.com.interesthub.SquareButton
android:layout_width="0dip"
android:layout_height="fill_parent"
android:layout_weight="1" >
<Button
android:id="#+id/list_article_like_button"
style="?android:attr/borderlessButtonStyle"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_vertical"
android:background="#drawable/custom_like_button"
android:contentDescription="#string/like_button"
android:padding="5dip" />
</com.goldtrimdevelopment.sites.google.com.interesthub.SquareButton>
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="match_parent"
android:orientation="vertical" >
<TextView
android:id="#+id/article_title"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_weight="3"
android:textSize="16sp" />
<TextView
android:id="#+id/article_link"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_weight="3"
android:singleLine="true"
android:textSize="12sp" />
</LinearLayout>
</LinearLayout>

I figured from your xml file that you want the layout to be a custom button and to its right 2 textviews which are vertically linear, while the buttons and the textviews are horizontall linear. Try the following values in your layout. I think it must solve the issue.
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent" or "wrap content"
android:orientation="horizontal" >
and the next linear layout as
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="vertical" >
and for both textviews set
android:layout_width="150dp"
try it and let me know.

Related

One of two Android ListView filling too much space

I would like to obtain this layout for an Android app for mobile phones:
Icon - Object1
List with entries related to Object1
Icon - Object2
List with entries related to Object2
So far I have used the following layout tree (edited graphically with the editor in Android Studio):
Root-LinearLayout
Vertical LinearLayout
Horizontal LinearLayout with icon and text
ListView
Vertical LinearLayout
Horizontal LinearLayout with icon and text
ListView
May be this is not the best way to organize such layout (may be I should use lists with header, but suggestions very welcome), however it can be a good case for understanding deeper how ListView works.
This is the graphical layout generated:
the blue row corresponds to the first LinearLayout. As you can see from the second screenshot that follows, the second list goes all the way down to Hell, bringing me with her. Is there any way to make the lists respect the wrap_content+ weight behaviour?
The XML code follows. I have tried several combos (both reasonable and unreasonable) of layout:weights but none works. I also tried to set the min-width of the first LinearLayout (the hidden one), but nothing changes.
Could you please help me?
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical" android:layout_width="match_parent"
android:layout_height="match_parent"
android:weightSum="2">
<LinearLayout
android:orientation="vertical"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_weight="1">
<LinearLayout
android:orientation="horizontal"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:gravity="center_vertical"
android:minHeight="50dp">
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/imageView15"
android:src="#drawable/abc_ic_menu_share_mtrl_alpha" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Object1"
android:id="#+id/textView24"
android:textSize="26dp"
android:paddingLeft="10dp" />
</LinearLayout>
</LinearLayout>
<ListView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/listView2"
android:layout_weight="1" />
<LinearLayout
android:orientation="vertical"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_weight="1">
<LinearLayout
android:orientation="horizontal"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:gravity="center_vertical">
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/imageView16"
android:src="#drawable/abc_ic_commit_search_api_mtrl_alpha" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Object2"
android:id="#+id/textView25"
android:textSize="26dp"
android:paddingLeft="10dp" />
</LinearLayout>
<ListView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/listView"
android:layout_weight="1" />
</LinearLayout>
It should work if you put your ListViews inside of the child LinearLayouts which hold the LinearLayout that has the TextView and ImageView. You also should be using "0dp" for the height when using weight with a vertical layout.
Something like this, I believe, should work
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical" android:layout_width="match_parent"
android:layout_height="match_parent"
android:weightSum="2">
<LinearLayout
android:orientation="vertical"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_weight="1">
<LinearLayout
android:orientation="horizontal"
android:layout_width="fill_parent"
android:layout_height="0dp"
android:gravity="center_vertical"
android:minHeight="50dp"
android:layout_weight=".2">
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/imageView15"
android:src="#drawable/abc_ic_menu_share_mtrl_alpha" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Object1"
android:id="#+id/textView24"
android:textSize="26dp"
android:paddingLeft="10dp" />
</LinearLayout>
<ListView
android:layout_width="wrap_content"
android:layout_height="0dp"
android:id="#+id/listView2"
android:layout_weight=".8" />
</LinearLayout>
Note the other changes: I gave the inner-LinearLayout an arbitrary weight of ".2" then the ListView a weight of ".8". And, of course, set the height to "0dp". You may need to play with those weights a bit but I think doing something like that for both first child LinearLayouts should get you close.
That may get your current layout to work but using headers and/or an ExpandableListView may be a better option.

How to make widget in the middle of layout stretch to fill the parent in Android

I have an Android layout question. I have a display where I am putting some text into the middle of a view that has a header at the top and three buttons at the bottom. What I am having trouble with is getting the TextView (which is inside a ScrollView) to stretch to fill up the available screen space. If I set the layout_height of the ScrollView to "fill_parent" the three buttons are pushed off the bottom of the screen. If I set it to "wrap_content" it is only as large as is needed to support the text that is put into the TextView.
Here is the XML for the layout I am using:
<?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="fill_parent"
android:orientation="vertical" >
<LinearLayout android:orientation="horizontal"
android:gravity="top"
android:layout_width="wrap_content"
android:layout_height="wrap_content" >
<ImageView android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/ic_launcher">
</ImageView>
<TextView android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:gravity="center_vertical"
style="#android:style/TextAppearance.Large"
android:text="#string/meetingdetail" />
</LinearLayout>
<ScrollView
android:layout_width="fill_parent"
android:layout_height="fill_parent">
<TextView android:id="#+id/meeting"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
style="#android:style/TextAppearance.Medium" />
</ScrollView>
<Button android:id="#+id/navigation"
android:text="#string/naviation"
android:onClick="meetingInfoOnClick"
android:layout_width="fill_parent"
android:layout_height="wrap_content" />
<Button android:id="#+id/mapsingle"
android:text="#string/mapsingle"
android:onClick="meetingInfoOnClick"
android:layout_width="fill_parent"
android:layout_height="wrap_content" />
<Button android:id="#+id/goback"
android:text="#string/goback"
android:onClick="meetingInfoOnClick"
android:layout_width="fill_parent"
android:layout_height="wrap_content" />
</LinearLayout>
Could someone suggest what would work best to make the ScrollView with the TextView fill up the available space but still allow the three buttons to appear?
Set the height of the ScrollView to 0dp and its weight to 1.
<ScrollView
android:layout_width="fill_parent"
android:layout_height="0dp"
android:layout_weight="1" >
<TextView android:id="#+id/meeting"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
style="#android:style/TextAppearance.Medium" />
</ScrollView>
However if you don't plan to have more than one views scrollable you should remove the ScrollView and use:
android:scrollbars="vertical"
attribute on your TextView since the TextView is scrollable itself.
Just replace your ScrollView tag code to..
<ScrollView
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_weight="1">
<TextView android:id="#+id/meeting"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
style="#android:style/TextAppearance.Medium" />
</ScrollView>
It will work fine, if still you have any problem then tell me. if works then accept as answer.

How to divide screen with three different-sized panel in android?

i want to create a screen like this on the android :
and achieving this, i write some codes like that.. But i didn't do what i want. The text area doesn't exist in the screen. What should i do ? Any opinion.. thank you in advance..
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/linearLayout123"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="vertical"
android:weightSum="1.0"
android:gravity="fill">
<LinearLayout
android:id="#+id/linearLayout12"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="top" >
<Button android:id="#+id/button1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Hello, I am a Button" />
</LinearLayout>
<LinearLayout
android:id="#+id/linearLayout2"
android:layout_width="118dp"
android:layout_height="fill_parent"
android:layout_gravity="right"
android:orientation="vertical" >
<Button android:id="#+id/button2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Hello, I am a Button" />
</LinearLayout>
<LinearLayout
android:id="#+id/linearLayout1"
android:layout_width="228dp"
android:layout_height="fill_parent"
android:layout_gravity="left" >
<TextView
android:id="#+id/text2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Hello, I am a TextView" />
</LinearLayout>
</LinearLayout>
A RelativeLayout will accomplish what you want
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent">
<LinearLayout
android:id="#+id/rightLayout"
android:layout_width="100dip"
android:layout_height="fill_parent"
android:layout_alignParentRight="true"
android:background="#003300"
android:orientation="vertical" >
</LinearLayout>
<LinearLayout
android:id="#+id/topLayout"
android:layout_toLeftOf="#id/rightLayout"
android:layout_width="fill_parent"
android:layout_height="100dip"
android:layout_alignParentLeft="true"
android:layout_alignParentTop="true"
android:background="#330033"
android:orientation="vertical" >
</LinearLayout>
<LinearLayout
android:id="#+id/bottomLayout"
android:layout_toLeftOf="#id/rightLayout"
android:layout_below="#id/topLayout"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_alignParentLeft="true"
android:background="#334433"
android:orientation="vertical" >
</LinearLayout>
</RelativeLayout>
The result as LinearLayouts and as Buttons/TextViews (since I wasn't sure which you wanted):
If you are using the LinearLayouts as a container to hold multiple views then leave it as I have it.
If you plan on having only one view in each of your "parts" change the LinearLayouts in my layout file to that type.
Ex. if you want Part 1 to be just a button change
<LinearLayout
android:id="#+id/topLayout"
to be
<Button
android:id="#+id/topLayout"
Nested views are bad so its good to avoid them if you can
you could :
Main linear layout with vertical alignment
add a new linear layout with horizontal alignment
add a new linear layout with horizontal or vertical alignment
So in the first layout ( the left part of main layout) you add a new linear layout with horizontal alignment and add the two elements you want.
In the second layout ( the right part of main layout) you add a new linear layout or directly the object you want to show

Android : Unable to set TableLayout properly as wanted

I am showing data from DB in an Activity. I want a Table and buttons on bottom. For data thought TableLayout would be best option for it. I added TableLayout to HorizontalView & to ScrollView making it scroll vertically & Horizontally. Am adding all rows dynamically - including header. This part is working fine.
I want is when the contents is less than the screen width, it should yet occupy the whole screen width. For eg. If a table fits well in Portrait mode then ofcourse for Landscape mode their will be blank space left on the right. I don't want that space to eb empty, instead to occupy by all columns. If the row width is greater than the screen width then no issues at all - as horiontal scrollbar appears.
I tried few variations, but nothing helped out. Any idea what settings to make to utlize all space (if at all avbl) & show it.
And yes, 1 more issue of horizontal scrollbar, it appears just on the last row. I want it to
appear below last row - so the border of last row is visible. My XML :
<?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="fill_parent" android:orientation="vertical">
<ScrollView xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent" android:layout_height="wrap_content"
android:scrollbars="horizontal|vertical">
<HorizontalScrollView android:layout_width="wrap_content" android:layout_height="wrap_content"
android:layout_marginTop="10dp" android:layout_marginBottom="10dp" >
<TableLayout android:id="#+id/browseTable" android:layout_width="fill_parent"
android:layout_height="wrap_content" android:layout_marginBottom="20dp"
android:background="#FF0000" android:stretchColumns="1,2,3">
</TableLayout>
</HorizontalScrollView>
</ScrollView>
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent" android:layout_height="wrap_content"
android:orientation="horizontal" android:gravity="center"
android:layout_marginTop="15dp">
<Button android:id="#+id/browseAddBtn" android:text="Add" android:layout_width="0dp" android:layout_height="wrap_content" android:layout_weight="1" android:layout_marginRight="10dp" />
<Button android:id="#+id/browseViewBtn" android:text="Edit" android:layout_width="0dp" android:layout_height="wrap_content" android:layout_weight="1" android:layout_marginRight="10dp" />
<Button android:id="#+id/browseReturnBtn" android:text="Return" android:layout_width="0dp" android:layout_height="wrap_content" android:layout_weight="1" />
</LinearLayout>
</LinearLayout>
OUTPUT :
I found one thing while solving your problem, about TableLayout when used inside a HorizontalScrollView. The android:stretchColumns is not working when we use Table Layout inside Horizontal Scroll View. So that you are getting blank space when screen is rotated or columns have less width data.
I hope you understand this. I am trying to solve this problem by replacing Horizontal Scroll View with some other. I will post answer if i get solution. Bye.
EDIT
Hi Tvd finally I got the solution for your problem. make below changes to your XML layout file.
In <HorizontalScrollView>
use
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:fillViewport="true"
Use stretchColumns = "*" in TableLayout if you want all columns to be stretched.
Bye. :-)
I did some changes. some of your problem will solve by below layout 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="fill_parent"
android:orientation="vertical" >
<ScrollView
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_weight="1"
android:scrollbars="horizontal|vertical" >
<HorizontalScrollView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginBottom="10dp"
android:layout_marginTop="10dp" >
<TableLayout
android:id="#+id/browseTable"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_marginBottom="20dp"
android:background="#FF0000" >
</TableLayout>
</HorizontalScrollView>
</ScrollView>
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
style="#android:style/ButtonBar"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:gravity="center"
android:orientation="horizontal" >
<Button
android:id="#+id/browseAddBtn"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginRight="10dp"
android:layout_weight="1"
android:text="Add" />
<Button
android:id="#+id/browseViewBtn"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginRight="10dp"
android:layout_weight="1"
android:text="Edit" />
<Button
android:id="#+id/browseReturnBtn"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="Return" />
</LinearLayout>

Make a component fill all available space on screen

I want something like this:
But I don't know how to resize the TextView so it gets all the available space on screen which is not ocuppied by the EditText or the Buttons. May I do it in the code, or in the xml?
At XML I tried putting the TextView into a FrameLayout, but it makes no difference. Currently looks like:
<?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">
<FrameLayout
android:layout_width="fill_parent"
android:layout_height="wrap_content">
<TextView
android:id="#+id/consola"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:scrollbars = "vertical"
android:text="#string/hello"/>
</FrameLayout>
<EditText
android:id="#+id/comando"
android:layout_width="fill_parent"
android:layout_height="wrap_content"/>
<LinearLayout
android:orientation="horizontal"
android:layout_width="fill_parent"
android:layout_height="wrap_content">
<Button
android:text="Conectar"
android:id="#+id/boton_conectar"
android:layout_width="wrap_content"
android:layout_weight="0.5"
android:layout_height="wrap_content">
</Button>
<Button
android:text="Enviar"
android:id="#+id/boton_enviar"
android:layout_width="wrap_content"
android:layout_weight="0.5"
android:layout_height="wrap_content">
</Button>
</LinearLayout>
</LinearLayout>
At the code I'm just checking if the Buttons are pushed with Listeners. One of them, when pushed, gets the text at the EditText, and appends it to the TextView. It works, and TextView gets higher, while EditText and Buttons downs one line. If I go on appending lines, finaly EditText and Buttons get out of the screen. I want to avoid this behaviour, and accomplish to get this 3 widgets sticked to the bottom of the screen.
Use the android:layout_weight=1 attribute, like the buttons on the bottom of the form. That will assign most of the space to it and anything that's left to the rest of the elements.
It's all about the weight. This should give you what you want:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="match_parent">
<TextView android:text="TextView"
android:id="#+id/textView1"
android:layout_weight="1"
android:layout_width="match_parent"
android:layout_height="0dp">
</TextView>
<EditText android:id="#+id/editText1"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<requestFocus></requestFocus>
</EditText>
<LinearLayout android:id="#+id/linearLayout1"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<Button android:text="Button"
android:id="#+id/button1"
android:layout_height="wrap_content"
android:layout_weight="1"
android:layout_width="0dp">
</Button>
<Button android:text="Button"
android:id="#+id/button2"
android:layout_height="wrap_content"
android:layout_width="0dp"
android:layout_weight="1">
</Button>
</LinearLayout>
</LinearLayout>
(Side note: When using weight, setting the corresponding height/width to 0dp sometimes gets around some weird behavior.)
Try android:fillViewport="true".

Categories

Resources