how to dynamically set imageView height based on its width - android

Having some imageViews in a list row.
The count of the imageView in the row are different, i.e. could be three or two imageView.
For the width it could be specified using
layout_width="0dp"
layout_weight="1dp"
for every imageView in the row. But the problem is the height, it should be 90% of the width of the imageView if the row has two imageView, and 80% of the width is the row has three imageView.
Is there way to do that in xml?
If not, where is the best place to do calc and set the height without too much overhead on the drawing?
Thanks!

Not sure if there is a way to do in xml. But this works in code, do it in the adapter::getView(), after get the corresponding imagView, change its height layoutParam but keep the width one.
Point size = new Point();
((WindowManager) context.getSystemService(Context.WINDOW_SERVICE)).getDefaultDisplay().getSize(size);
int screenWidth = size.x;
int columnNumber = (isItThree ? 3 : 2);
double ratio = (isItThree ? 0.8 : 0.9)
int desiredImageHeight = screenWidth/colunmNumber * ratio;
ViewGroup.LayoutParams imglayoutParams = imgView.getLayoutParams();
imglayoutParams.height = desiredImageHeight;
imgView.setLayoutParams(imglayoutParams);

In order to maintain the ratio between height and width the best practice is:
Defining one of its property with a value in dp and another with wrap content.
In your case:
android:layout_width="20dp"
android:layout_heignt="wrap_content"
By doing this the height should be adjusted according to the ratio of given width.

Related

First child of LinearLayout inside ScrollView with 1/3 space of device height

I have a ScrollView with a LinearLayout with 3 elements inside. I would like that the first element has a height of 1/3 the height of the device height and the other 2 with wrap_content, is this possible to do in xml or how would you do this? Using weight alone it does not seem possible because the LinearLayout inside the ScrollView could be longer than the device's height.
According to Android docs, android:layout_weight:
Indicates how much of the extra space in the LinearLayout is allocated to the view associated with these LayoutParams. Specify 0 if the view should not be stretched. Otherwise the extra pixels will be pro-rated among all views whose weight is greater than 0.
This implies that the weight is not dependent on the screen height, but rather only on its parent view, so you can't achieve that from xml. To achieve this I would compute the height of the screen and then resize the view:
Display screen = getWindowManager().getDefaultDisplay();
Point size = new Point();
screen.getSize(size);
int screenHeight = size.y;
myView.setLayoutParams(new LayoutParams(myView.getWidth(), screenHeight / 3));
You can give the first linear layout weight=0.333 with height=0 and the other two layout wrap_content

Android - Match parent height, adjust width to maintain aspect ratio in horizontal scroll view?

I have a horizontal scroll view that contains an ImageView followed by a horizontal LinearLayout (with child views). When I receive the ImageView from an API, I want it to be able to match parent in terms of height, then expand in terms of width to maintain aspect ratio. How should I configure the ImageView to make this happen?
Thanks!
Have you tried to simply specify match_parent for height and wrap_content for width? The parent with the same values.
Set the height of the ImageView to match_parent so it matches the height of the parent. Then just calculate the width based on the aspect ratio you're trying to achieve, e.g. -- 16:9 = height/0.5625. -- and set the width to that.
EDIT:
To get the target height, then calculate the target width based on that value, you would first get the height of the parent layout, then calculate the width, then set the LayoutParams of your ImageView, then add the view. Something like this...
RelativeLayout parentLayout = (RelativeLayout) findViewById(R.id.parent_layout);
int height = parentLayout.getHeight();
int targetWidth = (int)Math.round(height / 0.5625); //example for 16:9 ratio
ImageView imageView = new ImageView(this);
imageView.setLayoutParams(new ViewGroup.LayoutParams(
targetWidth,
ViewGroup.LayoutParams.MATCH_PARENT
));
parentLayout.addView(imageView);

setTextSize accordingly to ImageView's image size

I got a horizontally oriented LinearLayout with an ImageView and a TextView. TextView has a text of 1- or 2-digits number.
What I need is to set text size of a TextView to be exactly same in a hight of an ImageView's image.
I know I can get ImageView's Image height , but how can I make textSize as high accordingly?
View.getHeight():
Return the height of your view. Returns
Returns
    The height of your view, in pixels.
TextView.setTextSize(float):
Set the default text size to the given value, interpreted as "scaled
pixel" units. This size is adjusted based on the current density and
user font size preference.
Parameters
   size    The scaled pixel size.
This basically means you need to convert the height (px) to text height (sp):
float density = getResources().getDisplayMetrics().scaledDensity;
float textHeight = imageHeight / density;
Give constant height-width to both(image view and textview)... or try scaleType="fitxy"...
You can try:
float height = imageView.getHeight();
TextView tv = new TextView(context);
tv.setTextSize(height)
I'm not sure this will do exactly what you want, but it is the most obvious starting point I see.
well, I've found myself the following :
first we need to find a real height of an ImageView's Image - it's not as high as the ImageView, so it's explained well here : How to get the width and height of an android.widget.ImageView?
next we set the height of the text :
textView.setTextSize(TypedValue.COMPLEX_UNIT_PX,
imageView.getMeasuredHeight()*(imageView.getMeasuredHeight()/
imageView.getMeasuredWidth()));
which means we are setting textSize in raw pixels, then we take height and multiply it with the picture's ratio of height to width so TextView's text size will be exactly high as the image

Layout stretching

Is there a layout, that would allow me to make it in absolute values, but when it would be on larger / smaller screen, it would stretch and adjusted those values, to fit onto the screen but preserve the same look?
Relative layout still keens on exact values.
For example, I have a button and I want it to have it the width of 1/3 of the screen of every device.
Setting manualy in code the width of an element to (for example) screenWidth/3 works. Yet I don't think it's clean. But this technique works.
Find device dimensions at runtime and set width of button at runtime.
Display mDisplay = getWindowManager().getDefaultDisplay();
int deviceWidth = mDisplay.getWidth();
int deviceHeight = mDisplay.getHeight();
button.getLayoutParams().width = deviceWidth / 3;
Give the values in dpi of your layout and view and they will adjust themselves on any screen

Android: How can I set my custom surfaceview to a fixed size ratio in xml?

I am trying to have a surfaceview (a custom class which extends surfaceview) that I add in the xml layout to have a fixed size ratio: 4:3 (length to width).
I want it to fill as much as it can of it's parent, either on the length or width but once it reaches the full length or width it will adjust the other side to have a fixed size ratio like I said before.
How can I achieve such a thing?
Thanks.
In the onCreate method of your activity you could read the resolution of the screen and set the layout width and height to it.
Example assuming you're using RealtiveLayout:
private void create43RatioSurface() {
SurfaceView surfaceView43 = (SurfaceView)findViewById(R.id.surfaceView1);
DisplayMetrics metrics = getResources().getDisplayMetrics();
int height = 0;
int width = 0;
if(metrics.widthPixels < metrics.heightPixels){
width = metrics.widthPixels;
height= (metrics.widthPixels/4) * 3 ;
} else {
height= metrics.heightPixels;
width= (metrics.heightPixels/4) * 3 ;
}
RelativeLayout.LayoutParams layoutParams = new RelativeLayout.LayoutParams(width, height);
layoutParams.addRule(RelativeLayout.ALIGN_PARENT_LEFT, RelativeLayout.TRUE);
layoutParams.addRule(RelativeLayout.ALIGN_PARENT_TOP, RelativeLayout.TRUE);
surfaceView43.setLayoutParams(layoutParams);
}
This might be kind of hacky but you could maybe put a blank imageview as a sort of frame for the surfaceview. Now to explain the madness
1)Create an image asset that fits the proportion you want that is all
transparent. Lets call tis our ghost image (probably best to make it
invisible as well)
2)use a relative layout and place the imageview in the relative layout
with match_parent for height and width and using scaletype
CENTER_INSIDE or CENTER_CROP if you went van gocha and created a
massive asset
3)add your surface view to the layout after the imageview and
aligntop/bottom/right/left with the image view
I haven't tried this implementation but it should give you the ratio you want for whatever screen you have.

Categories

Resources