I need to show a list of buttons either vertically or horizontally and make that decision based on how the text fits in the view.
I need to display the buttons like this:
but if the width of the text is longer and it needs to move it to a new line, I need to change the orientation and set them vertically, like so:
The number of items can differ, from 2 to at most 10. How can I know if the text will fit in the horizontally aligned views so that If they don't I can make them align vertically?
If Parent Layout has more than 4(or)5 view the String value will definitely break into new line,so if u want suggestions Use this if it helps
Make Parent Layout as Linear Layout with default orientation as horizontal in XML
In JAVA code check String raspuns = "dynamic string"; length
Try this
LinearLayout parent_layout = findViewById(R.id.parent);
if(raspuns.length > 7){
parent_layout.setOrientation(LinearLayout.VERTICAL);
}
Hope it Helps
What you need is to use android.support.v7.widget.ButtonBarLayout which is
An extension of LinearLayout that automatically switches to vertical
orientation when it can't fit its child views horizontally.
Which is being used by Android itself in abc_alert_dialog_button_bar_material.xml
So the code would look like
<?xml version="1.0" encoding="utf-8"?>
<android.support.v7.widget.ButtonBarLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="bottom"
android:layoutDirection="locale"
android:orientation="horizontal"
android:paddingBottom="4dp"
android:paddingLeft="12dp"
android:paddingRight="12dp"
android:paddingTop="4dp">
<Button
android:id="#android:id/button3"
style="?attr/buttonBarNeutralButtonStyle"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Neutral button" />
<android.widget.Space
android:id="#+id/spacer"
android:layout_width="0dp"
android:layout_height="0dp"
android:layout_weight="1"
android:visibility="invisible" />
<Button
android:id="#android:id/button2"
style="?attr/buttonBarNegativeButtonStyle"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Negative button" />
<Button
android:id="#android:id/button1"
style="?attr/buttonBarPositiveButtonStyle"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Positive button" />
</android.support.v7.widget.ButtonBarLayout>
Output of this xml is
And if text is small for buttons, output for same layout is
just try like this and it's working fine for me
Layout
<HorizontalScrollView xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="wrap_content"
tools:context=".MainActivity">
<LinearLayout
android:id="#+id/linear"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="horizontal"
android:padding="8dp">
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_margin="8dp"
android:background="#color/colorAccent"
android:padding="16dp"
android:text="Hello World!"
android:textColor="#000000"
android:textSize="16sp"
android:textStyle="bold" />
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_margin="8dp"
android:background="#color/colorAccent"
android:padding="16dp"
android:text="Hello World!"
android:textColor="#000000"
android:textSize="16sp"
android:textStyle="bold" />
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_margin="8dp"
android:background="#color/colorAccent"
android:padding="16dp"
android:text="Hello World!"
android:textColor="#000000"
android:textSize="16sp"
android:textStyle="bold" />
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_margin="8dp"
android:background="#color/colorAccent"
android:padding="16dp"
android:text="Hello World!"
android:textColor="#000000"
android:textSize="16sp"
android:textStyle="bold" />
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_margin="8dp"
android:background="#color/colorAccent"
android:padding="16dp"
android:text="Hello World!"
android:textColor="#000000"
android:textSize="16sp"
android:textStyle="bold" />
</LinearLayout>
</HorizontalScrollView>
code for Rearrange views
val displayMetrics = DisplayMetrics()
windowManager.defaultDisplay.getMetrics(displayMetrics)
val width = displayMetrics.widthPixels
var viewsWidth = 0;
for (i in 0..linear.childCount - 1) {
linear.getChildAt(i).post({
viewsWidth += linear.getChildAt(i).width
if (i == linear.childCount - 1) {
if (width < viewsWidth) {
linear.orientation = LinearLayout.VERTICAL
for (k in 0..linear.childCount - 1) {
(linear.getChildAt(k) as Button).width = (width - resources.getDimension(R.dimen.spacing_large)).toInt()
linear.getChildAt(k).requestLayout()
}
}
}
});
}
And spacing_large is sum of margin_start and margin_end
Related
I have a chipgroup within a relative layout along with a textview whose code is shown below.
<RelativeLayout
...
<TextView
android:layout_width="30dp"
android:layout_height="wrap_content"
android:text="TextTitle"
android:layout_alignParentStart="true"
android:gravity="left"
android:layout_marginTop="16dp"
android:textColor="#android:color/white"
android:textStyle="bold"
android:textSize="14sp"
android:id="#+id/tv"
android:layout_toLeftOf="#id/cg"
android:layout_alignBaseline="#id/cg"
/>
<com.google.android.material.chip.ChipGroup
android:id="#+id/cg"
android:layout_width="wrap_content"
android:layout_height="14dp"
android:layout_marginTop="20dp"
android:layout_marginBottom="5dp"
android:layout_alignParentRight="true"
android:layout_alignParentEnd="true"
android:textColor="#android:color/black"
android:textStyle="bold"
android:textSize="12sp"
app:singleSelection="false"
app:chipSpacingVertical="32dp"
app:chipSpacingHorizontal="5dp"
app:singleLine="false"
/>
</RelativeLayout>
I add chips to this chipgroup dynamically like the below:
Chip chip;
for(int i=0;i<2;i++){
chip = new Chip(this);
chip.setText("Text:"+i);
chip.setChipBackgroundColorResource(android.R.color.darker_gray);
chip.setTextColor(Color.WHITE);
mChipGroup.addView(chip);
}
The above brings the textview and chipgroup side by side (with the chips at the extreme right from the textview,which is what I want).
For 2 or 3 chips the output looks like this:
But when I have more than 3 chips,it looks bad like this:
I referred the docs and tried to make the chipgroup multiline and added the following in chipgroup xml
app:chipSpacingVertical="32dp"
app:chipSpacingHorizontal="5dp"
app:singleLine="false"
It looks the same as in the pic2.
What I need is a chipgroup with multiline option with spacing as that in the pic1,i.e in the pic1 , I want Text3 beneath Text0 and Text4 beneath Text1 and so on, if the no of chips increases!.
Im sure I must be missing something,but dont know what it is.Any help will be very useful.Thanks in advance!!
I update from #Sajith 's answer,see if it could work:
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context=".MainActivity">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal"
android:weightSum="100">
<TextView
android:layout_width="0dp"
android:layout_weight="25"
android:layout_height="wrap_content"
android:text="TextTitle"
android:gravity="left"
android:layout_marginTop="16dp"
android:textColor="#android:color/white"
android:textStyle="bold"
android:textSize="14sp"
android:id="#+id/tv" />
<FrameLayout
android:layout_width="0dp"
android:layout_weight="75"
android:layout_height="wrap_content" >
<com.google.android.material.chip.ChipGroup
android:id="#+id/cg"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="end"
android:layout_marginTop="20dp"
android:layout_marginBottom="5dp"
android:textColor="#android:color/black"
android:textStyle="bold"
android:textSize="12sp"
app:singleSelection="false"
app:chipSpacingVertical="32dp"
app:chipSpacingHorizontal="5dp"
app:singleLine="false" />
</FrameLayout>
</LinearLayout>
</RelativeLayout>
use your xml like below
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context=".MainActivity">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal"
android:weightSum="100">
<TextView
android:layout_width="0dp"
android:layout_weight="25"
android:layout_height="wrap_content"
android:text="TextTitle"
android:gravity="left"
android:layout_marginTop="16dp"
android:textColor="#android:color/white"
android:textStyle="bold"
android:textSize="14sp"
android:id="#+id/tv"
/>
<com.google.android.material.chip.ChipGroup
android:id="#+id/cg"
android:layout_width="0dp"
android:layout_weight="75"
android:layout_height="wrap_content"
android:layout_marginTop="20dp"
android:layout_marginBottom="5dp"
android:textColor="#android:color/black"
android:textStyle="bold"
android:textSize="12sp"
app:singleSelection="false"
app:chipSpacingVertical="32dp"
app:chipSpacingHorizontal="5dp"
app:singleLine="false"
/>
</LinearLayout>
</RelativeLayout>
and your final screen would be like below . Adjust space and width of chips according to your requirement.
EDIT
if you want to set height use it like below in your activity (inside for loop)
chip.setChipMinHeight(10);
All of the previous solutions didn't work for me if you want to achieve a gmail like behaviour with chips on multiple lines. In order to do that I had to avoid using the ChipGroup and instead using a FlexboxLayout.
your_recipient_layout:
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="match_parent">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal">
<TextView
android:id="#+id/recipient_label_TV"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginStart="8dp"
android:layout_marginEnd="8dp"
android:layout_gravity="center_vertical" />
<com.google.android.flexbox.FlexboxLayout
android:id="#+id/recipient_group_FL"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginStart="8dp"
android:layout_gravity="center_vertical"
app:flexWrap="wrap"
app:alignItems="stretch"
app:alignContent="space_around"
app:showDivider="beginning|middle|end"
app:dividerDrawable="#drawable/divider">
<EditText
android:id="#+id/recipient_input_ET"
android:layout_width="wrap_content"
android:layout_height="32dp"
app:layout_flexGrow="1"
android:background="#android:color/transparent"
android:imeOptions="actionDone"
android:inputType="text"/>
</com.google.android.flexbox.FlexboxLayout>
</LinearLayout>
<androidx.recyclerview.widget.RecyclerView
android:id="#+id/recipients_list_RV"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:visibility="gone" />
The trick now is adding a new chip to the group but as second last position. Something like this:
private fun addChipToGroup(person: String, chipGroup: FlexboxLayout) {
val chip = Chip(context)
chip.text = person
chip.chipIcon = ContextCompat.getDrawable(requireContext(), R.mipmap.ic_launcher_round)
chip.isCloseIconEnabled = true
chip.isClickable = true
chip.isCheckable = false
chipGroup.addView(chip as View, chipGroup.childCount - 1)
chip.setOnCloseIconClickListener { chipGroup.removeView(chip as View) }
}
I'm designing an app in Android Studio. In the preview it looks like I want but when building the application there is a LinearLayout that contains two TextViews that looks smaller and I do not understand why
This is the Recycler View Item:
<?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/friend_layout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal">
<de.hdodenhof.circleimageview.CircleImageView
android:id="#+id/profile_picture"
android:layout_width="44dp"
android:layout_height="44dp"
android:src="#drawable/head" />
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical">
<TextView
android:id="#+id/name"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginStart="1dp"
android:gravity="left"
android:paddingLeft="2dp"
android:paddingRight="2dp"
android:textColor="#color/white"
android:textSize="16sp"
android:textStyle="bold"
tools:text="Guillermo Rodriguez" />
<TextView
android:id="#+id/friend_position"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="left"
android:text="delantero"
android:textColor="#color/white"
android:textSize="13sp" />
</LinearLayout>
This is how it looks: https://photos.app.goo.gl/BgNQhgpNKbgEGCCR6 and I need to the text fill the entirety width
I expect to see both TextView until the end of the screen but they end before the middle. Any ideas?
If I understood your question correctly, you must want the two TextViews to fill the entirety of the height, is that it?
In that case, in both your TextViews, change your layout_height attribute to 0dp and add android:layout_weigth=0.5 to them. This will make them fill the entire height of your LinearLayout, whichever height that might be, and they will be dividing the space right in the middle.
I recommend you utilize LinearLayout's weight attribute. set your root LinearLayout's to match_parent. and your nested LinearLayout and both TextView's layout_height to 0dp and their weight to 1
here's the edited code:
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:id="#+id/friend_layout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal">
<de.hdodenhof.circleimageview.CircleImageView
android:id="#+id/profile_picture"
android:layout_width="44dp"
android:layout_height="44dp"
android:src="#drawable/head" />
<LinearLayout
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="1"
android:orientation="vertical">
<TextView
android:id="#+id/name"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:layout_marginStart="1dp"
android:gravity="left"
android:paddingLeft="2dp"
android:paddingRight="2dp"
android:textColor="#color/white"
android:textSize="16sp"
android:textStyle="bold"
tools:text="Guillermo Rodriguez" />
<TextView
android:id="#+id/friend_position"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:gravity="left"
android:text="delantero"
android:textColor="#color/white"
android:textSize="13sp" />
</LinearLayout>
</LinearLayout>
Please check if your RecycleView has the proper width set (e.g. match_parent) and it can stretch to the whole width. Could you provide the xml code with the RecycleView?
i think you set the recyclerview to specific width. try to cahngethe width into match parent.
I recommend to user constraintlayout to avoid nested viewgroup. like this:
<androidx.constraintlayout.widget.ConstraintLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:id="#+id/friend_layout"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<ImageView
android:id="#+id/profile_picture"
android:layout_width="44dp"
android:layout_height="44dp"
android:src="#drawable/patient"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintStart_toStartOf="parent"/>
<TextView
android:id="#+id/name"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginStart="1dp"
android:gravity="left"
android:paddingLeft="2dp"
android:paddingRight="2dp"
android:textColor="#android:color/white"
android:textSize="16sp"
android:textStyle="bold"
tools:text="Guillermo Rodriguez"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toEndOf="#+id/profile_picture"/>
<TextView
android:id="#+id/friend_position"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:gravity="left"
android:text="delantero"
android:textColor="#android:color/white"
android:textSize="13sp"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toEndOf="#+id/profile_picture"
app:layout_constraintTop_toBottomOf="#+id/name"/>
I solved it! Someone configured it whit GridLayoutManager and it had to be with LinearLayoutManager.. I changed it and it was fixed
So I want to have a title with 2 buttons next to it. These buttons should stick to the left next to the text, and when the text becomes too long, it should flow on 2 lines.
I was able to replicate this by giving the textView a maxwidth, but this causes the textview to take that maxwidth, even if it reflows on 2 lines. Therefore my buttons don't align next to the text anymore.
Like this:
How can I make my textView take the width it needs, not the one I tell it to use as maxWidth?
Here comes the perfectly working answer using ConstraintLayout (as I love this layout).
This is the code.
<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" >
<android.support.constraint.ConstraintLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/text"
android:layout_marginTop="25dp"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintTop_toTopOf="parent"
android:maxWidth="300dp">
<TextView
android:layout_width = "wrap_content"
android:layout_height = "wrap_content"
android:maxWidth="300dp"
android:text="Some layout is going to be created and whatever I do it won't cross the limit."
android:textSize="30sp"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintRight_toRightOf="parent"
android:layout_marginEnd="10dp"
android:layout_marginStart="10dp"/>
</android.support.constraint.ConstraintLayout>
<ImageView
android:layout_height="40dp"
android:background="#365987"
android:layout_width="40dp"
android:layout_marginStart="5dp"
android:id="#+id/image"
app:layout_constraintLeft_toRightOf="#+id/text"
app:layout_constraintTop_toTopOf="#+id/text"/>
<ImageView
android:id="#+id/image1"
android:layout_height="40dp"
android:background="#e85f11"
android:layout_width="60dp"
android:layout_marginStart="5dp"
app:layout_constraintBottom_toBottomOf="#+id/image"
app:layout_constraintLeft_toRightOf="#+id/image"
app:layout_constraintTop_toTopOf="#+id/image"/>
</android.support.constraint.ConstraintLayout>
Outputs:
Whatever the text is, it will not cross the maxwidth. And with less width than maxwidth, it's width will be wrap_content.
<?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="vertical">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal">
<TextView
android:id="#+id/tv_male"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:layout_marginLeft="15dp"
android:text="Male:"
android:textColor="#111111"
android:textSize="12dp" />
<ImageView
android:id="#+id/iv_male"
android:layout_width="#dimen/_42sdp"
android:layout_height="#dimen/_42sdp"
android:layout_gravity="center_vertical"
android:gravity="center_vertical"
android:padding="10dp"
android:src="#drawable/block_user" />
<ImageView
android:id="#+id/iv_female"
android:layout_width="#dimen/_42sdp"
android:layout_height="#dimen/_42sdp"
android:layout_gravity="center_vertical"
android:gravity="center_vertical"
android:padding="10dp"
android:src="#drawable/blocked_user" />
</LinearLayout>
<TextView
android:id="#+id/tv_detail"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="This is something Demo Content"
android:layout_marginLeft="#dimen/_15sdp"
android:textColor="#111111"
android:textSize="12dp" />
</LinearLayout>
So you can just add content below the linear layout complete
I Hope it Helps you and you will get your solution.
Try this code
<?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:descendantFocusability="blocksDescendants"
android:orientation="vertical">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center_vertical"
android:orientation="horizontal">
<TextView
android:id="#+id/zero"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:maxLines="2"
android:paddingEnd="100dp"
android:text="Simple textdfddfdf dfdfdfdfdf dfdf Sample Text Sample Text" />
<LinearLayout
android:id="#+id/one"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignEnd="#+id/zero"
android:orientation="horizontal">
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#mipmap/ic_launcher" />
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#mipmap/ic_launcher" />
</LinearLayout>
</RelativeLayout>
</LinearLayout>
Here, You have to pass android:paddingEnd="100dp". This you can manage from dimens.xml
I hope. This will help full
You should use ConstraintLayout
compile 'com.android.support.constraint:constraint-layout:1.0.2'
Let's take an instance of that Planner part of the image.
<android.support.constraint.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:id="#+id/constraintLayout"
<!-- Other attributes -->
<TextView
android:id="#+id/text"
android:layout_width = "xxxdp"
android:layout_height = "xxxdp"
app:layout_constraintBottom_toBottomOf="#+id/constraintLayout"
app:layout_constraintLeft_toLeftOf="#+id/constraintLayout"
app:layout_constraintTop_toTopOf="#+id/constraintLayout"
<!-- Other attributes --> />
<ImageView
android:id="#+id/image1"
app:layout_constraintBottom_toBottomOf="#+id/text"
app:layout_constraintLeft_toRightOf="#+id/text"
app:layout_constraintTop_toTopOf="#+id/text"
<!-- Other attributes --> />
<ImageView
android:id="#+id/image1"
app:layout_constraintBottom_toBottomOf="#+id/text"
app:layout_constraintLeft_toRightOf="#+id/image1"
app:layout_constraintTop_toTopOf="#+id/image1"
<!-- Other attributes --> />
Definition of Attributes used.
layout_constraintTop_toTopOf — Align the top of the desired view to the top of another.
layout_constraintBottom_toBottomOf — Align the bottom of the desired view to the bottom of another.
layout_constraintLeft_toRightOf — Align the left of the desired view to the right of another.
I have a form. Which has few rows. Every row has two text views side by side. the left textview is static and the right textview is dynamic. based on the text of right textview(it may be any number of lines) the origin of the next row must depend as shown below. I am using relativelayout and writing in xml. How can i do it.
Note: I dont want to use grid or table layout due to some limitation.
RelativeLayout.LayoutParams params = new RelativeLayout.LayoutParams(ViewGroup.LayoutParams.WRAP_CONTENT, ViewGroup.LayoutParams.WRAP_CONTENT);
params.addRule(xxxxx);
Fix the left side textview static and draw the remaining items from java code.
You can try this way
<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" >
<LinearLayout
android:id="#+id/firstLinearLayout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_alignParentTop="true"
android:orientation="horizontal" >
<TextView
android:id="#+id/textView1"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="2"
android:singleLine="true"
android:text="Static Text 1"
android:textAppearance="?android:attr/textAppearanceMedium" />
<TextView
android:id="#+id/textView2"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="3"
android:singleLine="false"
android:text="Multiple line\nDynamic text 1"
android:textAppearance="?android:attr/textAppearanceMedium" />
</LinearLayout>
<LinearLayout
android:id="#+id/secondLinearLayout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_below="#+id/firstLinearLayout"
android:layout_marginTop="8dp" >
<TextView
android:id="#+id/textView3"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="2"
android:singleLine="true"
android:text="Static Text 2"
android:textAppearance="?android:attr/textAppearanceMedium" />
<TextView
android:id="#+id/textView4"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="3"
android:singleLine="false"
android:text="Multiple line\nDynamic text 2"
android:textAppearance="?android:attr/textAppearanceMedium" />
</LinearLayout>
</RelativeLayout>
I have a CustomListView, when I longClick on a row, the layout of that row changes to a different listRow Layout. So far, everything is working, however, the layout of the new view is compressed. Here are my xml files:
search_result_layout.xml --> this is the original xml file used by the customListView Adapter.
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/search_result_layout"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:minHeight="50dp"
android:orientation="horizontal"
android:padding="1dip" >
<TextView
android:id="#+id/dialogItemName"
android:layout_width="0dp"
android:layout_weight="0.54"
android:layout_marginRight="5dp"
android:layout_height="match_parent"
android:text="Item Name"
android:gravity="center"
android:textSize="10pt" />
<TextView
android:id="#+id/price"
android:layout_width="0dp"
android:layout_weight="0.14"
android:layout_height="match_parent"
android:text="Price"
android:gravity="center"
android:textSize="10pt" />
<TextView
android:id="#+id/discount"
android:layout_width="0dp"
android:layout_weight="0.10"
android:layout_height="match_parent"
android:text="Discount"
android:gravity="center"
android:textSize="10pt" />
<TextView
android:id="#+id/qtyInput"
android:layout_width="0dp"
android:layout_weight="0.14"
android:layout_height="match_parent"
android:text="qtyInput"
android:gravity="center"
android:textSize="10pt" />
<TextView
android:id="#+id/discInput"
android:layout_width="0dp"
android:layout_weight="0.11"
android:layout_height="match_parent"
android:text="discInput"
android:gravity="center"
android:textSize="10pt" />
</LinearLayout>
Here is my search_result_inflate.xml file
<?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="wrap_content"
android:minHeight="50dp"
android:orientation="horizontal"
android:padding="1dip" >
<TextView
android:id="#+id/dialogItemName"
android:layout_width="0dp"
android:layout_weight="0.54"
android:layout_marginRight="5dp"
android:layout_height="match_parent"
android:text="Item Name"
android:gravity="center"
android:textSize="10pt" />
<TextView
android:id="#+id/price"
android:layout_width="0dp"
android:layout_weight="0.14"
android:layout_height="match_parent"
android:text="Price"
android:gravity="center"
android:textSize="10pt" />
<TextView
android:id="#+id/discount"
android:layout_width="0dp"
android:layout_weight="0.10"
android:layout_height="match_parent"
android:text="Discount"
android:gravity="center"
android:textSize="10pt" />
<EditText
android:id="#+id/qtyInput"
android:layout_width="0dp"
android:layout_weight="0.14"
android:layout_height="match_parent"
android:hint="qtyInput"
android:inputType="number"
android:gravity="center"
android:textSize="10pt" />
<EditText
android:id="#+id/discInput"
android:layout_width="0dp"
android:layout_weight="0.11"
android:layout_height="match_parent"
android:hint="discInput"
android:inputType="number|date"
android:gravity="center"
android:textSize="10pt" />
</LinearLayout>
The two files are almost identical, only that the last two TextViews become EditTexts instead so the user can input the values he or she wants.
Also, kindly notice that I placed weight in my textViews and EditTexts, so that the spaces are maximized when the user shifts the view from portrait to landscape.
resultListView.setOnItemLongClickListener(new OnItemLongClickListener() {
#Override
public boolean onItemLongClick(AdapterView<?> parent, View view,
int position, long id) {
// TODO Auto-generated method stub
TextView textViewQuantity = (TextView)view.findViewById(R.id.qtyInput);
TextView textViewDiscountReq = (TextView)view.findViewById(R.id.discInput);
TextView textViewName = (TextView)view.findViewById(R.id.dialogItemName);
TextView textViewPrice = (TextView)view.findViewById(R.id.price);
TextView textViewDiscount = (TextView)view.findViewById(R.id.discount);
textViewQuantity.setVisibility(View.GONE);
textViewDiscountReq.setVisibility(View.GONE);
textViewName.setVisibility(View.GONE);
textViewPrice.setVisibility(View.GONE);
textViewDiscount.setVisibility(View.GONE);
LinearLayout ll_inflate = (LinearLayout)view.findViewById(R.id.search_result_layout);
Log.d("Angelo", "original width = " + ll_inflate.getWidth());
View child = getLayoutInflater().inflate(R.layout.search_result_inflate, null);
TextView newText = (TextView)child.findViewById(R.id.qtyInput);
newText.setText(textViewQuantity.getText().toString());
EditText enter_txt = (EditText)child.findViewById(R.id.qtyInput);
ll_inflate.addView(child);
Log.d("Angelo", "not original width = " + ll_inflate.getWidth());
return false;
}
});
When the I longClick an item, the layout changes. However, the TextViews and the EditTexts are all next to one another, as if the weight property was ignored. At first I thought that the width might have changed before and after the view was changed, but the Log told me it had 1136 width (I'm using a 2nd Gen Nexus 7). Now I'm blank, the width of the parent didn't change but the weight value was ignored. How do I fix this? Would assigning the weight programmatically a viable solution?
Also, follow up question, I only want the last 2 TextViews to change to EditTexts. So what I try to do to achieve that effect is that from the original layout, I pull the values of the first 3 fields (Item Name, Price, Discount) by doing textView.getText().toString() and get the textviews from the new layout and use setText() but so far, it did not work, any suggestions?
UPDATE:
Upon reading this link, I think that the Weight property of the TextViews inside the LinearLayout is being ignored when I use the LinearLayout as my ListView Row View. Nesting another Linear Layout did not help much either.
I placed another LinearLayout inside as such:
<?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="wrap_content"
android:minHeight="50dp"
android:orientation="horizontal"
android:padding="1dip" >
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="horizontal"
android:padding="1dip" >
<TextView
android:id="#+id/dialogItemName"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_marginRight="5dp"
android:layout_weight="0.70"
android:gravity="center"
android:text="Item Name"
android:textSize="23sp" />
<TextView
android:id="#+id/price"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="0.16"
android:gravity="center"
android:text="Price"
android:textSize="23sp" />
<TextView
android:id="#+id/discount"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="0.12"
android:gravity="center"
android:text="Discount"
android:textSize="23sp" />
<EditText
android:id="#+id/qtyInput"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="0.16"
android:gravity="center"
android:hint="qtyInput"
android:inputType="number"
android:textSize="23sp" >
<requestFocus />
</EditText>
<EditText
android:id="#+id/discInput"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="0.13"
android:gravity="center"
android:hint="discInput"
android:inputType="number|date"
android:textSize="23sp" />
</LinearLayout>
</LinearLayout>
Any ideas?
Call instead:
ll_inflate.addView(child, new LinearLayout.LayoutParams(ViewGroup.LayoutParams.MATCH_PARENT, ViewGroup.LayoutParams.WRAP_CONTENT));