I have a layout like this. Colored green is a horizontal LinearLayout, blue is a vertical LinearLayout and black are EditTexts (whose width and height can change). The red line represents where the EditTexts in the blue LinearLayout touch.
What I'm trying to accomplish is align the outer EditTexts so that the red line is always in the vertical center of them. On the image it already looks like that since I set the layout's gravity to center, but my issue occurs when the height of one of the EditTexts in the blue layout is bigger that the other. It should look like this, but in reality it looks like this.
What I'm trying to achieve can be accomplished with ConstraintLayouts by constraining the outer EditText's top to the bottom of the top inner (inner meaning those which used to be in the blue layout) EditText and the bottom to the top of the bottom inner EditText, but then there are other issues
All EditTexts would be in the same layout which messes with the code a lot
You can constrain the end/start to only one other View and so one of the inner EditTexts would overlap the outer one (e.g. if the outer EditText was constrained to the top inner EditText, the bottom inner EditText would overlap the outer one if it were wider than the top one) Demonstration
Every View is created dynamically so using LinearLayouts makes locating each one way easier
How would you approach this issue?
There is no way to use just the XML for the layout you have to center the external EditTexts to the red line. ConstraintLayout is the way to go but, if that is not desirable, then you can apply translation to the external EditTexts. The idea is that you would measure the vertical location of the red line and the top position of each EditText. You would then apply enough translation in the Y direction to place the EditTexts where you want them
Se setTranslationY() and getY().
Related
Using Android views, I've stumbled upon a recurring issue and thought it was about time to ask if anyone has a solution.
I have a parent ConstraintLayout, the blue one in the picture.
This layout contains two views: a green view constrained to the left of the parent, and the red view constrained to the center of the parent.
Both red view and green view are text views, and their actual size may vary depending on the language.
My wish is for the red view to always stay centered, so to grow symmetrically left and right until it reaches the green view. At its maximum width, the red view will touch the green view on the left, and there will be empty space on the right of the same width as the width of the green view.
Problem is that I can't find a way using regular XML layouts to do it. I can think of several hacks to do it, but thinking there should be a clean way.
Any idea?
Not sure but just an idea, maybe you can try to add two more barriers. One at the end of the green box at left. And one for it's symmetric. Because you said
and there will be empty space on the right of the same width as the
width of the green view
So with these two barriers you can mark the borders of the red one.
And you can set the constraints of the red to the barriers, and with 0dp width may work. Let us know :)
If you are certain that the width of the red view will not ever need to go to two lines because it runs out of space (maybe it is truncated, marque'd or ellipsised) then you would simply constrain the start and end of the red view to a guideline set in the center of the ConstraintLayout.
However, if you can't guarantee that the red view will never need two lines then you are stuck with a hack. The simplest hack would be to create an invisible view on the right that has the same width as the green view. (It could simply be another TextView with the same text and characteristics.) You would then constrain the start of the red view to the end of the green view and the end to the start of the invisible view.
I am overlapping an ImageView on top of a View in a RelativeLayout.
something like this:
1
Where the middle white circle(ImageView) is overlapping the white vertical border(View).
But for some reason I am not managing to constraint the circle above the z position of the white border. and if the border moves say to the right side of the screen, I want the circle to move there too. but instead the circle always remains in the center regardless to the position of the border.
How do I this in a RelativeLayout?
T.I.A
You can make like:
AlignLeftOf the border
Then code: circle.translationX( circle_width/2)
(and a bit of justification, it should be good)
Have a look at the picture: the root layout is a LinearLayout, horizontal. It contains a TextView, the text can be pretty long (I use singleline andellipsize), then the image in the second column of the layout won't be visible. Is there a way to force the image/ its layout column to be drawn other than using fixed width values? For example let the layout be drawn from right to left?
I'd like to use the center of a View to align it in another View, let's say, a TextView in a RelativeLayout.
I don't want to have it centered inside the RelativeLayout but rather offset from the bottom left corner.
At the moment I align the TextView ParentLeft and ParentBottom and use margins on left and bottom to move it away from those sides.
However, because my TextView is set to wrap_content in width, it "moves" around when the text inside and with it its width changes (since the borders of the TextView are used for the offsets).
I want the center of the TextView to stay on my offsetted position.
Is this possible in the xml, without having to write code that manages the offset or to use another layout?
That's the unwanted behaviour when the text changes: Screen1
The desirable behaviour: Screen2
Note that the center of the TextView stays the same.
There is a simple logic here. If you want to align a view with respect to the parent then for relative layout you can use align_parent wherein in linear use android:layout_gravity. Here in you case make textview as match_parent and set gravity to centre.
I have 2 textviews per horizontal linearlayout row on two rows. All the views are set as 0dp width and weight 1. They all have the same font and text size etc.
The views on the left side are gravity aligned left and the two on the right are gravity aligned right.
When both textviews text length overflow android always gives precedence to the textview on the right and ellipse the views on the left.
Is there a method that can be used to control which view ellipses when both views on the same row would not fit.
Ideally I want the views on the right to ellipse in favor of those on the left. Or failing that make them ellipse evenly per row.
thanks
i don't think there is a feature of order of the views to manage how they are measured.
you can customize the linearLayout by extending it in order to support this feature , but this is too hardcore for this task .
i would suggest putting the problematic views (those that take too much space and you don't with them to take too much space) into a new layout , and set its width to match_parent .
this way , it should take the rest of the space at the end of the measurements of the other views ,