Develop Reference

Aligning three views in Android layout

I have three views that are intended to look as follows:
+-----++-------------------------+
| 1 || |
+-----+| 3 |
+-----+| |
| 2 || |
+-----++-------------------------+
So far, so good. However...
Sometimes (3) is very small, and I want it centred in the vertical space used for (1) and (2).
+-----+
| 1 |+-------------------------+
+-----+| 3 |
+-----+| |
| 2 |+-------------------------+
+-----+
Other times, (3) is large, and I want (1) to align with the top (3), and for (2) to align with the bottom of (3):
+-----++-------------------------+
| 1 || |
+-----+| |
| 3 |
| |
+-----+| |
| 2 || |
+-----++-------------------------+
I have tried:
an outer Relative layout: (1) and (2) overlap in the "small-3" case
a linear layout containing (1) and (2) (with and without weights): the alignment at top/bottom does not work in the "big-3".
an outer linear layout (with various height settings): I can not get case (2) and (3) to work with the same settings.
To give a little context, (1) and (2) are buttons and (3) is a text block of varying size.
At this point I assume I am missing some very basic setting (or widget) that will make this work as intended.
Note: I have not included source code because there have, literally, been over a dozen different configurations tried and none worked.

Just asking the question helped...pretty sure the answer is to use ConstraintLayout.

Use ConstraintLayout and use the design tab instead of writing the code yourself when using the ConstraintLayout, its pretty easy to achieve what you want. Dont use RelativeLayout or LinearLayout for this.

Android TextView intricate alignment

community.
The desired effect is to have TextView that:
has left-aligned text
is glued to the right to its right-aligned sibling control
adjusts to the available horizontal space e.g. wraps its text if needed
1/ More than the optimal TextView + ImageView width:
|---Empty-space---|---TextView---|--Image--|
| |1. Aa | |
| |2. Bbb cccc | [---] |
| |3. Ddd eeee ff| |
|-----------------|--------------|---------|
| | | |
. . . .
. . . .
. . . .
2/ Less than optimal TextView + ImageView width:
the TextView wraps its text
no empty space to the left of the TextView due to low available horizontal space
||-TextView-|--Image--|
||1. Aa | |
||2. Bbb | |
||cccc | [---] |
||3. Ddd | |
||eeee ff | |
||----------|---------|
|| | |
.. . .
.. . .
.. . .
Asking the question after trying numerous things with linear and constraint layouts.
Satisfying conditions #1 and #2 from above is easily achieved by setting the width of the TextView to wrap_content, its textAlignment="textStart" (by default) and the gravity (not layout_gravity) for the whole LinearLayout to end. The right alignment for both controls - TextView and ImageView, when using a ConstraintLayout, is achieved by gluing the ImageView to the right and then setting the constraintHorizontal_bias="1.0" for the TextView.
The problem comes when the last condition (#3) should be satisfied as well - make the TextView's text wrappable. This is achievable by setting the TextView's width="0dp" and layout_weight="1" (in case of LinearLayout) or just setting width="0dp" for the ConstraintLayout scenario.
Any suggestions are appreciated and welcome.

Android mosaic layout (or view)

How can I implement the layout (or view) that will place images most rationally in 3:4, 1:1 or 4:3 area. Images order is important; images may be cropped. For example:
2 tall pictures:
5 wide pictures:
...and so on...

I can't comment your question to say that your examples don't appear in your question. But I would like to propose using this library AndroidMosaicLayout to display your images in mosaic pattern.
Actually this library enables using 90 different patterns consists of 4 basic shapes (small square, big square which is 4 small squares, vertical rectangle and horizontal rectangle, both rectangle consists of 2 small square).
You have to define the pattern you need using an array describing that pattern, this array of size 8, so each pattern the basic gird forming it consists of 8 small squares.
For example, if you want to get the following patter:
----------- ----------- ----------- -----------
| | | |
| | img 2 | img 3 |
| vert. | small | horiz. horiz. |
| | | |
| img 1 | --------- | --------- | --------- |
| | | |
| | img 4 | img 5 |
| vert. | horiz. horiz. | small |
| | | |
---------- ----------- ----------- -----------
You need to define pattern by setting the role for each square of the main 8 square shaping the entire pattern. So for this shape the pattern will be like this:
BLOCK_PATTERN pattern[] = {
BLOCK_PATTERN.VERTICAL, BLOCK_PATTERN.SMALL, BLOCK_PATTERN.HORIZONTAL, BLOCK_PATTERN.HORIZONTAL,
BLOCK_PATTERN.VERTICAL, BLOCK_PATTERN.HORIZONTAL, BLOCK_PATTERN.HORIZONTAL, BLOCK_PATTERN.SMALL
};

Android line wrapping trim extra space

I have an Android TextView which I'm trying to display some multi-line text. I want the first line to be centered, and all of the other lines to be centered as well, but left-aligned with the first line. When wrapping the text, the TextView goes as wide as the view will allow, even though the actual text stopped a while ago. I would like to trim this extra padding space.
Here's a rudimentary ASCII thing that kinda shows what I'm talking about.
| FirstLineOfText |
| SecondLine |
| |
| |
But what I'm getting is more like
| FirstLineOfText |
| SecondLine |
| |

Try using two textviews. One for the first line and the second for the others in relative layout. Then align the second one to left using android:layout_alignLeft = "idOfFirstTextView".

Combining SurfaceView with other Views such as TextView and Buttons

I'm totally new to android programming (just did some tutorials/read the dev guides etc.) and as every newbie I want to do a useless game :-).
Currently I'm struggling with the layout of different views. Similar to the example I've made a class which extends a SurfaceView and put that into a FrameLayout. Around this SurfaceView I want to have other View's like Buttons & TextViews.
Something like this:
-----------------------------------------------
| TextView | SurfaceView | TextView |
| | | |
------------ ------------
| | | TextView |
| | | |
| | ------------
| | | TextView |
| | | |
| | ------------
| | | |
| | | |
-----------------------------------------------
| Button Button |
-----------------------------------------------
I've managed to do something like this with a FrameLayout and RelativeLayouts (sticking the TextViews at the edges of the screen) but I'd like to better control the size of the SurfaceView as it should be a multiple in width and height of the object(s) I'll be drawing in it. I've tried setting layout_width and layout_height to some dp values but when I start painting at 0,0 it's still at the very top-left corner (where the TextView is..).
So, what's the best practice to achieve a layout as above? Using what layout? Or should I better draw my text inside the draw() function of my SurfaceView instead?

Layouts are the right way to combine OpengGL content with buttons, labels and other type of view objects. You can combine layouts inside other layouts... so you may build your screen step by step combining Linear Layouts or whatever you prefer.
For example, you can use a Relative layout to setup the buttons (b1, b2) and the rest of the screen:
+-----------+
| Zone 1 |
+-----+-----+
| b1 | b2 |
+-----+-----+
Then inside Zone 1, you can use a Horizontal Linear Layout for the 3 main columns
+----+----+----+
| c1 | c2 | c3 |
+----+----+----+
Inside of c2 you can place the SurfaceView, and in c1 the text label
Inside c3 will be a new Vertical Linear layout to display the text labels.
+----+
| t1 |
+----+
| t2 |
+----+
| t3 |
+----+