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) }
}
Related
I am trying to use constraint flow. I need to arrange the TextView one after another on the screen.
Here is my code:
<androidx.constraintlayout.widget.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:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<TextView
android:id="#+id/text1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="[AAAAAAAA]"
tools:ignore="MissingConstraints" />
<TextView
android:id="#+id/text2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="[BBBBBBBB]"
tools:ignore="MissingConstraints" />
<TextView
android:id="#+id/text3"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="[CCCCCCCC]"
tools:ignore="MissingConstraints" />
<TextView
android:id="#+id/text4"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="[DDDDDDDD]"
tools:ignore="MissingConstraints" />
<TextView
android:id="#+id/text5"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="[EEEEEEEE]"
tools:ignore="MissingConstraints" />
<TextView
android:id="#+id/text6"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="[FFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFF]"
tools:ignore="MissingConstraints" />
<androidx.constraintlayout.helper.widget.Flow
android:id="#+id/flow1"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:padding="10dp"
app:constraint_referenced_ids="text1,text2,text3,text4,text5,text6"
app:flow_horizontalBias="0"
app:flow_horizontalGap="10dp"
app:flow_horizontalStyle="packed"
android:layout_marginEnd="20dp"
app:flow_verticalBias="0"
app:flow_wrapMode="chain"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:layout_goneMarginEnd="20dp" />
</androidx.constraintlayout.widget.ConstraintLayout>
Everything works well except for the last TextView. Since the text is very long, some of the text goes off the screen (See the picture below). I am trying to set margin, but it doesn't work.
I added TextView in xml for clarity. I need to add them dynamically at runtime, so I can't set the width of my TextView to match_parent, because I don't know if the content will fit within the screen.
Please help me. I need a margin on the right, regardless of the length of the text in the TextView.
Note: TextViews can also be added dynamically. I need add TextView at runtime. Therefore, I cannot set the width of the TextView to match_parent in runtime, because I don’t know if the text can fit within the width of the screen or not.
Here is my code to add View programatically:
private fun addViews() {
val list = generateChipButtons()
list.forEach { button ->
val view = LayoutInflater.from(baseContext).inflate(R.layout.chip_view, constraintContainer, false).apply {
id = View.generateViewId()
this.findViewById<TextView>(R.id.tvChipText).text = button.text
}
constraintContainer.addView(view)
flowView.addView(view)
}
}
Set 0dp at width and add a contrast to set the size ratio for width. The code above is shown with wrap_content, with the width exceeding the text size.
<TextView
android:id="#+id/text6"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:text="[FFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFF]"
tools:ignore="MissingConstraints"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintEnd_toEndOf="parent" />
Use match_parent for TextView text6. Try below code
<androidx.constraintlayout.widget.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:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<TextView
android:id="#+id/text1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="[AAAAAAAA]"
tools:ignore="MissingConstraints" />
<TextView
android:id="#+id/text2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="[BBBBBBBB]"
tools:ignore="MissingConstraints" />
<TextView
android:id="#+id/text3"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="[CCCCCCCC]"
tools:ignore="MissingConstraints" />
<TextView
android:id="#+id/text4"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="[DDDDDDDD]"
tools:ignore="MissingConstraints" />
<TextView
android:id="#+id/text5"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="[EEEEEEEE]"
tools:ignore="MissingConstraints" />
<TextView
android:id="#+id/text6"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="[FFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFF]"
tools:ignore="MissingConstraints" />
<androidx.constraintlayout.helper.widget.Flow
android:id="#+id/flow1"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:padding="10dp"
app:constraint_referenced_ids="text1,text2,text3,text4,text5,text6"
app:flow_horizontalBias="0"
app:flow_horizontalGap="10dp"
app:flow_horizontalStyle="packed"
app:flow_verticalBias="0"
app:flow_wrapMode="chain"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:layout_goneMarginEnd="20dp" />
</androidx.constraintlayout.widget.ConstraintLayout>
Just set the width match_parent of textView #+id/text6
<TextView
android:id="#+id/text6"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="[FFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFaslkfjadflskjflasdkjfsdlajkfasdlfjkasdlfjkaslkdfjasdflkjasdfasdlfjksdafFFFFsdflkfdaslkfjsdafkljsdlafkjdasfljk]"
tools:ignore="MissingConstraints" />
i Have similar issue i just set to match parent and margin working fine code snippet
<androidx.appcompat.widget.AppCompatTextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginHorizontal="#dimen/_20sdp"
android:layout_marginBottom="#dimen/_22sdp"
android:fontFamily="#font/font_muli"
android:text="#string/welcome_msg"
android:textColor="#color/white"
android:textSize="#dimen/_11sdp"
app:layout_constraintBottom_toTopOf="#+id/btn_login"
app:layout_constraintEnd_toEndOf="#+id/btn_login"
app:layout_constraintStart_toStartOf="#+id/btn_login" />
Where btn_login is MaterialButton.
I've a ListView containing some rows, and especially a row combining categories and distance items in 2 TextView:
the category item can contain one or more categories, so this TextView must be truncable
the distance item is only displayed if the user has allowed the geolocation, so this TextView can be hidden
in this case, the category item must fill all the row's width
The expected result looks like this screenshot from the Maps app on iOS:
I've tried to doing this with a LinearLayout, but this doesn't work as expected:
<LinearLayout android:id="#+id/AffiliateCellDetail"
android:layout_below="#id/AffiliateCellTitle"
android:layout_height="wrap_content"
android:layout_width="match_parent" >
<TextView android:id="#+id/AffiliateCellCategories"
android:layout_height="wrap_content"
android:layout_width="wrap_content"
android:ellipsize="end"
android:singleLine="true"/>
<TextView android:id="#+id/AffiliateCellDistance"
android:layout_height="wrap_content"
android:layout_width="wrap_content"/>
</LinearLayout>
Is there a better approach to achieve this?
I finally achieve this by using ConstraintLayout:
<android.support.constraint.ConstraintLayout
xmlns:app="http://schemas.android.com/apk/res-auto"
android:id="#+id/AffiliateCellDetail"
android:layout_below="#id/AffiliateCellTitle"
android:layout_height="wrap_content"
android:layout_width="match_parent" >
<TextView android:id="#+id/AffiliateCellCategories"
android:layout_height="wrap_content"
android:layout_width="0dp"
android:ellipsize="end"
android:singleLine="true"
app:layout_constraintHorizontal_chainStyle="packed"
app:layout_constraintHorizontal_bias="0"
app:layout_constraintWidth_default="wrap"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toLeftOf="#+id/AffiliateCellDistance"/>
<TextView android:id="#+id/AffiliateCellDistance"
android:layout_height="wrap_content"
android:layout_width="wrap_content"
app:layout_constraintBaseline_toBaselineOf="#+id/AffiliateCellCategories"
app:layout_constraintLeft_toRightOf="#+id/AffiliateCellCategories"
app:layout_constraintRight_toRightOf="parent"/>
</android.support.constraint.ConstraintLayout>
Try this:
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/AffiliateCellDetail"
android:layout_width="match_parent"
android:orientation="horizontal"
android:layout_height="wrap_content">
<TextView
android:id="#+id/AffiliateCellCategories"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:ellipsize="end"
android:singleLine="true" />
<TextView
android:id="#+id/AffiliateCellDistance"
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
</LinearLayout>
android:layout_weight="1" will make the category TextView expand whenever there is place to fill.
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 created showcase view using https://github.com/amlcurran/ShowcaseView library. By default the showcase view circle is pointing to the center of the element.
I want to move this circle to the beginning of the TextView
please help me
Updates
My layout
<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"
tools:context="com.bm.eg.activities.CreateProfileActivity">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical">
<include layout="#layout/toolbar_transparent" />
<TextView
android:id="#+id/tv_title"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginBottom="8dp"
android:layout_marginLeft="40dp"
android:layout_marginRight="40dp"
android:layout_marginTop="8dp"
android:ellipsize="end"
android:hint="#string/hint_title"
android:singleLine="true"
android:textColor="#android:color/white"
android:textColorHint="#color/white_transparency_50"
android:textSize="24sp" />
in activity
mTVTitle = (TextView) findViewById(R.id.tv_title);
mShowcaseView = new ShowcaseView.Builder(this)
.setTarget(new ViewTarget(mTVTitle))
.setContentTitle(getString(R.string.sv_create_profile_title))
.setContentText(getString(R.string.sv_create_profile_title_description))
.setStyle(R.style.CustomShowcaseTheme2)
.blockAllTouches()
.replaceEndButton(R.layout.showcase_view_cusom_button)
.build();
Finally after researching on your issue i found a solution for you.
You have to modify your layout design add one more RelativeLayout in your design like below and add two TextViews in it and include your tv_title and hack_txt textview in it like below.
Note: hack_txt android:hint="aaaaaa" must add 5 or 6 character in it and set android:visibility="invisible".
<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"
tools:context="com.bm.eg.activities.CreateProfileActivity">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical">
<include layout="#layout/toolbar_transparent" />
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginBottom="8dp"
android:layout_marginLeft="40dp"
android:layout_marginRight="40dp"
android:layout_marginTop="8dp">
<TextView
android:id="#+id/tv_title"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:ellipsize="end"
android:hint="#string/hint_title"
android:singleLine="true"
android:textColor="#android:color/white"
android:textColorHint="#color/white_transparency_50"
android:textSize="24sp" />
<TextView
android:id="#+id/hack_txt"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:ellipsize="end"
android:hint="aaaaaa"
android:textSize="24sp"
android:visibility="invisible" />
</RelativeLayout>
<!--... your other view-->
</LinearLayout>
</RelativeLayout>
Now update here too
mTVTitle = (TextView) findViewById(R.id.tv_title);
mTVHack = (TextView) findViewById(R.id.hack_txt);
Lastly Update here too.
.setTarget(new ViewTarget(mTVHack))
You are Done happy Coding.
Suppose there is an XML Layout like this:
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#color/white"
android:orientation="horizontal"
android:paddingLeft="#dimen/margin_medium" >
<TextView
android:id="#+id/title"
style="#style/label_text_dark"
android:layout_width="0dp"
android:layout_height="______h1_____"
android:layout_weight="8"
android:gravity="center_vertical" />
<View
android:id="#+id/v_line"
android:layout_width="#dimen/margin_extra_small"
android:layout_height="______h2_____"
android:background="#color/light_gray" />
which eventually results to this:
so the question: is there a way to bind h2 to h1 in xml (NOT PROGRAMMATICALLY) so whenever h1 changes h2 changes automatically.
what am I looking for should look similar to this:
<View
android:id="#+id/v_line"
android:layout_width="#dimen/margin_extra_small"
android:layout_height="#+id/title.height"
android:background="#color/light_gray" />
android:layout_height="#+id/title.height" (this of course not works)
NOTE: one of elements can also be outside of parent container, e.g. v_line can be outside of linear layout
thanks in advance
You can do like this-
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_baselineAligned="false"
android:orientation="horizontal"
android:background="#color/white">
<TextView
android:id="#+id/title"
style="#style/label_text_dark"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="Last" />
<View
android:id="#+id/v_line"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:background="#color/light_gray" />
</LinearLayout>
So the solution is to disable baseline alignment for the container view when it is not useful for your application. Then setting the layout weight of each view to be equal.
Also I encourage you to check out this article - shifty-baseline-alignment.
Try to set up this values:
<TextView
android:id="#+id/title"
style="#style/label_text_dark"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="8"
android:gravity="center_vertical" />
<View
android:id="#+id/v_line"
android:layout_width="#dimen/margin_extra_small"
android:layout_height="match_parent"
android:background="#color/light_gray" />
Heigth of LinearLayout is correct.
You can try like this:
<TextView
android:id="#+id/title"
style="#style/label_text_dark"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="8"
android:gravity="center_vertical" />
<View
android:id="#+id/v_line"
android:layout_width="#dimen/margin_extra_small"
android:layout_height="wrap_content"
android:layout_alignTop="#id/title"
android:background="#color/light_gray" />
alignTop will resize your view as TextView height changes..Good Luck
You can do it using RelativweLayout..Fix the Width of Views as you want
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#color/white"
android:orientation="horizontal"
android:paddingLeft="#dimen/margin_medium" >
<TextView
android:id="#+id/title"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="8"
android:background="#119283"
android:gravity="center_vertical" />
<View
android:id="#+id/v_line"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_alignTop="#+id/title"
android:layout_weight="3"
android:layout_alignBottom="#+id/title"
android:layout_toRightOf="#+id/title"
android:background="#342748" />