I am new to android and am trying to create a list view row item as follows:
On the far left of the listview item I need two stacked text views
In the center of the listview item I need an additional two stacked text view
On the far right I need a checkbox
I want to make the width of the center textviews a constant size, irrespective to the length of text.
Every time I adjust the middle linear layout, it pushes the checkbox off the screen unless I manually give it a width (which will not work for multiple screen sizes). Can someone please help?
I've tried using weights and all but I can't figure it out.
<RelativeLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginLeft="10dp"
android:layout_marginRight="10dp"
android:gravity="left"
android:orientation="horizontal">
<LinearLayout
android:id="#+id/left"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:gravity="center"
android:orientation="vertical">
<TextView
android:id="#+id/starttime"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="0dp"
android:layout_marginTop="5dp"
android:padding="2dp"
android:singleLine="true"
android:text="10:35am"
android:textAppearance="?android:attr/textAppearanceMedium"
android:textColor="#929692"
android:textSize="12sp" />
<TextView
android:id="#+id/endtime"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="0dp"
android:singleLine="true"
android:text="11:55am"
android:textColor="#929692"
android:textSize="12sp" />
</LinearLayout>
<LinearLayout
android:id="#+id/middle"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginLeft="0dp"
android:layout_toRightOf="#id/left"
android:orientation="vertical">
<TextView
android:id="#+id/sessionname"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginLeft="10dp"
android:layout_marginTop="5dp"
android:ellipsize="end"
android:padding="2dp"
android:singleLine="true"
android:text="ok this is where my text goes it is very long
and it will push stuff off"
android:textAppearance="?android:attr/textAppearanceMedium"
android:textColor="#000000"
android:textSize="14sp" />
<TextView
android:id="#+id/location"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginLeft="10dp"
android:ellipsize="end"
android:singleLine="true"
android:text="#android:string/ok"
android:textColor="#929692" />
</LinearLayout>
<LinearLayout
android:id="#+id/right"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="0dp"
android:layout_toRightOf="#id/middle"
android:orientation="vertical">
<CheckBox
android:id="#+id/list_checkbox"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:gravity="right"
android:checked="false" />
</LinearLayout>
</RelativeLayout>
Used constraintlayout and it worked!
Related
I'm working with a class that extends Dialog. It should display a progressbar element. Sometimes there will be a message, sometimes there isn't.
The progressbar shows when there is no message but does not show when there is a message and I do not understand why.
Here is the layout code:
<TextView
android:id="#+id/dialog_message"
style="#style/arial"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:layout_marginTop="20dp"
android:layout_marginLeft="100dp"
android:layout_marginRight="100dp"
android:layout_marginBottom="20dp"
android:text=""
android:textAlignment="center"
android:textColor="#android:color/white"
android:textSize="18sp"
/>
<ProgressBar
android:id="#+id/progress"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:layout_marginBottom="30dp"
android:layout_marginLeft="100dp"
android:layout_marginRight="100dp"
android:layout_marginTop="10dp"
android:visibility="gone" />
Here is the java:
public void progressDialog () {
if(this.message.getText().length() > 0){
message.setVisibility(View.VISIBLE);
}else{
message.setVisibility(View.GONE);
}
progress.setVisibility(View.VISIBLE);
leftButton.setVisibility(View.GONE);
rightButton.setVisibility(View.GONE);
}
When message is set GONE the progressbar shows, when message is set VISIBLE the progressbar does not show. I assume it is getting hidden by the message somehow.
I've tried moving it around in the layout as this question might suggest was needed ProgressBar not displaying, but to no avail.
How do I get the progressbar to always show when calling progressDialog()?
Edit***** Added full layout xml
<?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:background="#drawable/dialog_background"
android:orientation="vertical">
<TextView
android:id="#+id/dialog_title"
style="#style/arialBold"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:layout_marginBottom="5dp"
android:layout_marginTop="35dp"
android:ellipsize="end"
android:maxLines="1"
android:text="#string/waiting"
android:textColor="#android:color/white"
android:textSize="21sp" />
<TextView
android:id="#+id/dialog_message"
style="#style/arial"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:layout_margin="30dp"
android:text=" "
android:textAlignment="center"
android:textColor="#android:color/white"
android:textSize="20sp" />
<ProgressBar
android:id="#+id/progress"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:layout_marginBottom="30dp"
android:layout_marginLeft="100dp"
android:layout_marginRight="100dp"
android:layout_marginTop="30dp"
android:visibility="gone" />
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:layout_marginBottom="30dp"
android:orientation="horizontal">
<LinearLayout
android:id="#+id/dialog_button_one"
style="#android:style/Widget.Button"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:background="#color/purple"
android:orientation="horizontal">
<TextView
android:id="#+id/dialog_button_one_text"
style="#style/arialBold"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginBottom="10dp"
android:layout_marginLeft="#dimen/alert_dialog_button_margin_left_right"
android:layout_marginRight="#dimen/alert_dialog_button_margin_left_right"
android:layout_marginTop="10dp"
android:ellipsize="end"
android:maxLines="1"
android:textColor="#android:color/white"
android:textSize="20sp" />
</LinearLayout>
<LinearLayout
android:id="#+id/dialog_button_two"
style="#android:style/Widget.Button"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:layout_marginStart="20dp"
android:background="#color/purple"
android:orientation="horizontal">
<TextView
android:id="#+id/dialog_button_two_text"
style="#style/arialBold"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginBottom="10dp"
android:layout_marginLeft="#dimen/alert_dialog_button_margin_left_right"
android:layout_marginRight="#dimen/alert_dialog_button_margin_left_right"
android:layout_marginTop="10dp"
android:ellipsize="end"
android:maxLines="1"
android:textColor="#android:color/white"
android:textSize="20sp" />
</LinearLayout>
</LinearLayout>
</LinearLayout>
I think you are using linear layout. So use Relative Layout instead of linear layout.
Add a parent constraint layout to your linear layout and move progress bar out of linear layout.
<constraint>
<linear/>
<progress/>
</constraint>
Some thing like this:
<?xml version="1.0" encoding="utf-8"?>
<android.support.constraint.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="match_parent">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#drawable/dialog_background"
android:orientation="vertical"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintBottom_toBottomOf="parent"
>
<!-- Your complete layout -->
</LinearLayout>
<ProgressBar
android:id="#+id/progress"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintBottom_toBottomOf="parent"
android:visibility="gone" />
</android.support.constraint.ConstraintLayout>
Ok, it looks like you use some wrong property for what you want, look:
android:layout_gravity="center" will put your TextView in center of the layout, but you also set it in your ProgressBar this mean that only one of then will be shown, it is only useful when you want to show one view at time, if you want to show both, try to remove one of this property.
Another thing, you set android:layout_margin="30dp" on TextView, so your progressBar will be far removed from TextView, which may also cause the invisibility of the ProgressBar, try 16dp.
<TextView
android:id="#+id/dialog_message"
style="#style/arial"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center" // remove here or in ProgressBar
android:layout_margin="16dp" // I just replace 30dp to 16dp
android:text=" "
android:textAlignment="center"
android:textColor="#android:color/white"
android:textSize="20sp" />
EDIT - Another Answer
I edit your full XML code, replacing some margin with padding, and show the progressBar always. You can now hide/show the textView or progressbar, it should work.
I also replace some property, since I have not it here, make sure to add again. Hope it help you.
I recommend to use RelativeLayout to improve your UI. Below I show the current XML behavior.
When ProgressBar is showed
The full source code on link below, I am unable to paste the code here.
https://gist.github.com/pedromassango/a6dc213823b297931f1ef2e6b6954466
I am trying to align 3 text views but the textview contents are not aligning with each other, since I plan to add 3 more and I want text values to line up.
The values line up if I align the first one to the parent left, second in the middle and the last one to the right, but I need space for 3 more text views.
Here is how it looks:
RecyclerView Textviews
<?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="wrap_content">
<TextView
android:id="#+id/value"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Value"
android:padding="8dp"
android:gravity="left"
android:layout_alignParentTop="true"
android:layout_alignParentLeft="true"
/>
<TextView
android:id="#+id/amount"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Amount"
android:padding="8dp"
android:layout_centerHorizontal="true"
android:gravity="left"
android:layout_toRightOf="#id/value"
/>
<TextView
android:id="#+id/bid"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Bids"
android:padding="8dp"
android:gravity="left"
android:layout_toRightOf="#id/amount"
android:layout_alignParentTop="true"
/>
</RelativeLayout>
If you give each textview the same width, you can ensure that they will line up with each other. You can achieve this by giving each textview a weight of 1 within a LinearLayout.
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:orientation="horizontal"
android:layout_height="wrap_content">
<TextView
android:id="#+id/value"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="Value"
android:padding="8dp"
android:gravity="left" />
<TextView
android:id="#+id/amount"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="Amount"
android:padding="8dp"
android:gravity="left" />
<TextView
android:id="#+id/bid"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="Bids"
android:padding="8dp"
android:gravity="left" />
</LinearLayout>
I define two components (One text View and one Button) in Linear layout.
<LinearLayout
android:id="#+id/layout_1"
android:orientation="horizontal"
android:layout_width="fill_parent"
android:layout_height="wrap_content">
<TextView
android:id="#+id/edit_view1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textSize = "15sp"
android:layout_weight="5"
android:layout_marginTop="20dp"
android:layout_alignParentLeft="true"
android:gravity="center"
android:hint="Write Greeting" />
<ImageButton
android:id="#+id/imageButton1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:layout_toRightOf="#+id/edit_view1"
android:layout_alignParentRight="true"
android:background="#android:color/transparent"
android:src="#drawable/e301"/>
</LinearLayout>
If I write long text, the position of my ImageButton is changed. I want to fix the position. Any suggestion?
Replace your layout contents as :
<LinearLayout
android:id="#+id/layout_1"
android:orientation="horizontal"
android:layout_width="fill_parent"
android:layout_height="wrap_content">
<TextView
android:id="#+id/edit_view1"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:textSize = "15sp"
android:layout_weight="5"
android:layout_marginTop="20dp"
android:gravity="center"
android:hint="Write Greeting" />
<ImageButton
android:id="#+id/imageButton1"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:background="#android:color/transparent"
android:src="#drawable/e301"/>
</LinearLayout>
You can't use RelativeLayout's properties of alignment inside Linear layout.
See your modified code:
<LinearLayout
android:id="#+id/layout_1"
android:orientation="horizontal"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:weightSum="3"
xmlns:android="http://schemas.android.com/apk/res/android">
<TextView
android:singleLine="false"
android:id="#+id/edit_view1"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:textSize = "15sp"
android:layout_marginTop="20dp"
android:text="etegtdrgrgbvcvbghgfffffffffffffffffffffffffffff"
android:gravity="center"
android:hint="Write Greeting"
android:layout_weight="2"/>
<ImageButton
android:id="#+id/imageButton1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:background="#android:color/transparent"
android:src="#drawable/ic_launcher"
/>
</LinearLayout>
Keep layout width as 0 dp using weight and weightSum, so it will adjust. Also, keep sengleLine as false for textview.
Output:
Hope this helps.
Try below code:-
<LinearLayout
android:id="#+id/layout_1"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:orientation="horizontal" >
<TextView
android:id="#+id/edit_view1"
android:layout_width="0dp"
android:layout_weight="5"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_marginTop="20dp"
android:gravity="center"
android:hint="Write Greeting"
android:textSize="15sp" />
<ImageButton
android:id="#+id/imageButton1"
android:layout_width="0dp"
android:layout_weight="1"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:layout_toRightOf="#+id/edit_view1"
android:background="#android:color/transparent"
android:src="#drawable/e301" />
</LinearLayout>
Using weight then you must have width = 0dp(horizontal) and heigth = 0dp(vertically)
Use weights: you didn't define weightSum of layout so your weights are now useless. Set parent layout's weightSum to 6 (in order to use your values) or 100 and set children's weights as percents. And change children views' widths to 0dp.
[optional] Set button's width to match_parent so it'll take all remaining space.
In LinearLayout layout_toRightOf, layout_alignParentRight, layout_alignParentLeft are redundant. Use gravity for children views instead. (for Button it'll be `gravity="right").
Use the below coding. Tell me if you want better alignment. I have used default default image for alignment. If you want better than this, then give buttom image also.
<LinearLayout
android:id="#+id/layout_1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:gravity="center_horizontal" >
<RelativeLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1" >
<TextView
android:id="#+id/edit_view1"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_marginTop="20dp"
android:gravity="center"
android:hint="Write Greeting dfdsfdsfsdfadsfdfadf"
android:textSize="15sp" />
</RelativeLayout>
<RelativeLayout
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_weight="3" >
<ImageButton
android:id="#+id/imageButton1"
android:gravity="center"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#android:color/transparent"
android:src="#drawable/ic_launcher" />
</RelativeLayout>
</LinearLayout>
<LinearLayout
android:id="#+id/layout_information"
android:layout_width="0dp"
android:layout_height="fill_parent"
android:layout_weight="0.17"
android:gravity="center"
android:orientation="horizontal" >
<TextView
android:id="#+id/text_view_destination"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="\# Home in"
android:textColor="#color/solid_white"
android:textSize="19sp"
android:textStyle="bold"
android:layout_gravity="bottom"
/>
<TextView
android:id="#+id/text_view_time"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="30dp"
android:textColor="#color/solid_white"
android:textSize="25sp"
android:textStyle="normal"
android:layout_gravity="bottom"
/>
</LinearLayout>
I want to center the two textViews vertically,
but I want them to be aligned to one line at their bottom.
Now they are alined to the same bottom,
but they are at the bottom of their parent layout.
How can I do this?
I have thought to wrap their current layout parent ("parent1") with another layout
("parent2")
and make "parent1" be in the center of "parent2".
Is there another way without adding elements?
If your problem is that both views are aligned at the bottom of their parent you can use this.
Both views are still aligned to the same bottom and centered on the screen.
Your layout looks like a part of a bigger XML (weight=0.17), that is why I have used fill_parent on layout_width.
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/layout_information"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_weight="0.17"
android:gravity="center"
android:orientation="horizontal" >
<TextView
android:id="#+id/text_view_destination"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:text="\# Home in"
android:textColor="#color/solid_white"
android:textSize="19sp"
android:textStyle="bold" />
<TextView
android:id="#+id/text_view_time"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="30dp"
android:text="\# Home in"
android:textColor="#color/solid_white"
android:textSize="25sp"
android:textStyle="normal"
android:layout_alignParentBottom="true"
android:layout_toRightOf="#id/text_view_destination"
android:layout_alignBaseline="#id/text_view_destination" />
</RelativeLayout>
try this way
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/layout_information"
android:layout_width="match_parent"
android:layout_height="fill_parent"
android:gravity="center_vertical|bottom"
android:orientation="horizontal" >
<TextView
android:id="#+id/text_view_destination"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:gravity="center"
android:text="HOme in"
android:textColor="#color/solid_white"
android:textSize="19sp"
android:textStyle="bold" />
<TextView
android:id="#+id/text_view_time"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:gravity="center"
android:textColor="#color/solid_white"
android:textSize="25sp"
android:text="Home out"
android:textStyle="normal" />
</LinearLayout>
Here's what I want to achieve:
I have at table with a lot of table rows. Each row should have two text view with a product title and subtitle on top of each other (subtitle not implementet yet). The should be left aligned. To the right I want a spinner to select the quantity.
The texts come from the database and are of course of different lengths.
Here is what I've come up with so far:
<ScrollView android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_weight="1">
<TableLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="#+id/barmenu"
android:background="#99ffff"
android:scrollbars="vertical">
<TableRow
android:layout_height="wrap_content"
android:background="#ffff99"
android:layout_width="match_parent">
<RelativeLayout
android:layout_width="match_parent"
android:background="#0000ff">
<TextView
android:id="#+id/productTitle"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#88ffff"
android:ellipsize="end"
android:padding="2dp"
android:singleLine="true"
android:text="Product name"
android:textColor="#000000"
android:gravity="left"
android:textSize="13sp"
android:textStyle="bold" />
<Spinner
android:gravity="right"
android:layout_height="40dp"
android:layout_toRightOf="#id/productTitle"
android:width="100dp"
android:layout_width="wrap_content" />
</RelativeLayout>
</TableRow>
<TableRow
android:layout_height="wrap_content"
android:background="#ffff99"
android:layout_width="match_parent">
<RelativeLayout
android:layout_width="match_parent"
android:background="#0000ff">
<TextView
android:id="#+id/productTitle2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#88ffff"
android:ellipsize="end"
android:padding="2dp"
android:singleLine="true"
android:text="Some long long long long name"
android:textColor="#000000"
android:gravity="left"
android:textSize="13sp"
android:textStyle="bold" />
<Spinner
android:gravity="right"
android:layout_height="40dp"
android:layout_toRightOf="#id/productTitle2"
android:width="100dp"
android:layout_width="wrap_content" />
</RelativeLayout>
</TableRow>
</TableLayout>
</ScrollView>
Screendump:
First problem is that the RelativeLayout doesn't fill out the width of the table row. And the second problem: the spinners are not right aligned.
What am I missing?
best regards
Allan
android:fillViewport="true"
add this line to your ScollView attributes and you're done :)
I'd make it simpler and lighter. Just use RelativeLayout for all these 4 views. Align to right both spinners and make textview's with - match_parent and add toLeftOf the relative spinner. I think you will see what you want.
Add android:layout_weight="1" to your relativelayout