Android - get image inside imageview to fill completely - java

I have a bitmap which I am reading from a particular location on the device like such and am setting the image to an ImageView
scaledBitmap = BitmapFactory.decodeFile(selectedImagePath);
ivImage.setImageBitmap(scaledBitmap);
And thats how I am setting the xml code for that imageview
<ImageView
android:id="#+id/ivImage"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentTop="true"
android:adjustViewBounds="true"
android:layout_centerHorizontal="true"
android:scaleType="fitXY" />
Is there a way I can remove the blank space above the image inside the ImageView?

Try Change android:scaleType="fitXY" to android:scaleType="centerCrop"

I had the same problem, and what I remember is removing adjustViewBounds attribute line from code will fix it. Try this and let me know.

scaleType="fitCenter" (default when omitted)
will make it as wide as the parent allows and up/down-scale as needed keeping aspect ratio.
scaleType="centerInside"
if the intrinsic width of src is smaller than parent widthwill center the image horizontally
if the intrinsic width of src is larger than parent widthwill make it as wide as the parent allows and down-scale keeping aspect ratio.
It doesn't matter if you use android:src or ImageView.setImage* methods and the key is probably the adjustViewBounds.

use this
<ImageView
android:id="#+id/ivImage"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentTop="true"
android:scaleType="centerCrop" />

Related

Programmatically set scale x and y of constraint layout to fit screen in any devices

I have a constraint layout which displays like an image view but it contains multiple views with the width set as wrap_content.
The constraint layout is put inside horizontal scroll bar.
My problem is,.. for the small dpi phones, the width of layout becomes big so I have to scroll to see the full layout. But I can fix it using this in the xml of constraint layout by adding
android:scaleX="0.7"
android:scaleY="0.7"
But the problem is, for the high dpi phones, the layout becomes very small and there are blank spaces appear around the layout. So i think I need to adjust the scaleX and scaleY to programmatically so that it will become a variable to adjust the layout scale for different screensizes. How to adjust this scaleX and Y in java code programmatically according to the screen dpi?
example,
for the 420dpi phones, the scales should be 0.8
for the 320dpi phones, the scales should be 0.6 or lower, etc...
but using these values with if statement will not accurate for all phones. I want an accurate variable float value of scale to fit the screen for every dpi displays. How to get this float value of scaleX and scaleY from the screen dpi. Please. (if possible, i don't want to use Horizontal scrollview. I want the scale of constraint layout to fit the width of screen only. And also I can't use different layouts in this case.)
This is my xml for this
<androidx.core.widget.NestedScrollView
android:id="#+id/scrollview"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_marginBottom="55dp"
android:fillViewport="true"
android:visibility="visible"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_bias="0.0"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintVertical_bias="0.0">
<androidx.constraintlayout.widget.ConstraintLayout
android:id="#+id/constraintlayoutprintcard"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginEnd="5dp"
android:layout_marginStart="5dp"
android:layout_marginTop="5dp"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent">
<HorizontalScrollView
android:id="#+id/horizontalscrollview"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:background="#00FFFFFF"
android:fillViewport="true"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent">
<androidx.constraintlayout.widget.ConstraintLayout
android:id="#+id/constraintlayoutprint"
android:layout_width="500dp"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:background="#color/colorWhite1"
android:scaleX="0.8"
android:scaleY="0.8"
android:visibility="visible"
tools:ignore="ExtraText">
</androidx.constraintlayout.widget.ConstraintLayout>
</HorizontalScrollView>
</androidx.constraintlayout.widget.ConstraintLayout>
</androidx.core.widget.NestedScrollView>
Set width of the image to match_parent with margins that you want and height as you wish. This will fit the width of the image according to screen width
Try creating the layout programmatically. There's an inner class in every layout that deals with setting the parameters.
Try this thread
If for some reason there are no scaleX and scaleY properties in the GridLayout and GridLayout.Params classes, you may have to go through each of the children in the layout and adjust the weight and gravity. It's always possible that the xml version is doing just that behind the scenes.

Autosize = uniform only shrinks text to fit, not increasing size

I have a TextView that sometimes contains a short string sometimes a long one, I need its font to resize to it's best fit. This works well when it comes to shrinking. I'm not sure why but once the textView font size is shrinked, it stays that size when the TextView is updated with a setText, even if the string is really short. So basically, autosize=uniform is being able to shrink to its best fit, but not to grow to its best fit. What am I missing?
<TextView
android:id="#+id/preguntaView2"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:gravity="center"
android:maxLines="4"
android:paddingLeft="10dp"
android:paddingTop="5dp"
android:paddingRight="10dp"
android:text="TextView"
android:textColor="#android:color/background_light"
android:textSize="24sp"
app:autoSizeMaxTextSize="24sp"
app:autoSizeTextType="uniform"
app:layout_constraintBottom_toTopOf="#+id/verticalLayout"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />
You need to increase your app:autoSizeMaxTextSize.
android:textSize="24sp"
app:autoSizeMaxTextSize="24sp"
You have set the textSize and autoSizeMaxTextSize to the same value which means that the text is only able to shrink, as it can't get any bigger than 24sp. To fix this increase the app:autoSizeMaxTextSize.
You could also try using a fixed value for the height of the TextView.

Increase the ImageView or ImageButton Size using XML

I've been trying to increase the size of a ImageButton/ImageView in a relative layout with all the possible attributes but had no success. no matter what size I put. As I checked the displayed button is 32dp, if I lower the value the image will resize to small but will never enlarge more than 32dp.
I am kinda confused here, 32px is xhdpi image size, is that the reason its not enlarging ?
Image is the made accordingly to support all the 5 dpi (mdpi, hdpi, etc ..)
this activity belong to layout-large as I am trying to make it for large screen as well.
here is how I am doing it:
<ImageView
android:id="#+id/quantity_plus"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_toRightOf="#id/product_qty"
android:background="#android:color/transparent"
android:src="#drawable/ic_button_add"
android:adjustViewBounds="true"
android:maxWidth="100dp"
android:scaleType="fitXY"
android:layout_centerVertical="true" />
</RelativeLayout>
You want to increase the size then do this:
<ImageView
android:id="#+id/quantity_plus"
android:layout_width="100dp"
android:layout_height="60dp"
android:layout_toRightOf="#id/product_qty"
android:background="#android:color/transparent"
android:src="#drawable/ic_button_add"
android:adjustViewBounds="true"
android:scaleType="fitXY"
android:layout_centerVertical="true"/>
Instead of Wrap_Content for width & height specify some size
change the width & height according to your required need
Edit:
wrap_content will always just wrap your image & will not increase the size of the imageview
To use on different size devices:
put the values in res->values->dimens folder for normal, small & large devices
and use like :
android:layout_width="#dimens/widthSize"
android:layout_width="#dimens/heightSize"
Well you are using wrap content for your width and height. With those set it will always just wrap the image and not be any large.... Even if your MaxWidth is set to a larger size. You will need to set those values to a specific value either in your XML or in your class in Java. Hope this helps!
You can change height and width accordingly using layout_width,layout_height tag.scaleType="fitXY" can be distorting the image so use scaleType="fitCenter" maybe that can help.
<ImageView
android:id="#+id/quantity_plus"
android:layout_width="100dp"
android:layout_height="100dp"
android:layout_toRightOf="#id/product_qty"
android:background="#android:color/transparent"
android:src="#drawable/ic_button_add"
android:adjustViewBounds="true"
android:maxWidth="100dp"
android:scaleType="fitXY"
android:layout_centerVertical="true" />

ImageView within RelativeLayout is not matching parent

So, I'm trying to view a camera preview as a background with an imageview on top of it. Check this question out, that I've asked, to get a better idea of what I'm trying to accomplish. However, instead of using a FrameLayout, I found it easier to use a RelativeLayout (for the reason of placing views where I want on the screen). The problem is that I can't get the imageview (over the surface view) to take up the whole screen. No matter how I re-size the image it still displays in the center without filling the screen.
So, my question is, how would I make the imageview fill the entire screen over the surface view? Perhaps, I am making a simple mistake but if that is the case please point it out. Any help will be greatly appreciated! Thanks!
Here's the XML file:
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:id="#+id/relative" >
<ImageView
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:id="#+id/image"
android:src="#drawable/background" >
</ImageView>
<Button
android:id="#+id/scan"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
android:layout_centerVertical="true"
android:layout_margin="10dp"
android:text="Scan"
android:textSize="20dp"
android:textStyle="bold"
android:onClick="Scan" />
<Button
android:id="#+id/search"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#+id/scan"
android:layout_centerHorizontal="true"
android:layout_margin="10dp"
android:text="Search"
android:textSize="20dp"
android:textStyle="bold"
android:onClick="Search" />
<Button
android:id="#+id/importing"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#+id/search"
android:layout_centerHorizontal="true"
android:layout_margin="10dp"
android:text="Import"
android:textSize="20dp"
android:textStyle="bold"
android:onClick="Import" />
</RelativeLayout>
And here's the code where I place the views (bring to front so they are visible over the surface view):
mPreview = new CameraPreview(this, mCamera);
relative.addView(mPreview);
layout.bringToFront();
scan.bringToFront();
search.bringToFront();
friendImport.bringToFront();
EDIT:
Here's an example image of what I'm talking about (I am trying to get the white transparent image to cover the whole screen):
Am I correct that you want to stretch android:id="#+id/image" into your entire layout?
First check in layout view that the ImageView takes entire space as it is supposed to.
If so, then add the proper scaling type to your ImageView attribute list:
android:scaleType="fitXY"
Or as an alternative, apply the image resource not as "src" but as "background":
android:background="#drawable/background"
Good luck.
After experimenting for a while, I seem to have found a solution to my problem. My image was showing up similar to this picture:
Which is weird, because this is how a 9-patch image works and I did not declare my image as a 9-patch. But even when I called match_parent (or even fill_parent) it only filled to the fill area like in the image I posted.
So, with lots of trial and error, I took away any border that was on the image and took all the blur effects off. The image was, for some reason, a dramatically smaller file size. Then, I tried to place this as the background and... success!
I'm not too sure as to why it did not work to begin with, but, I have a theory that, perhaps, because there was a 1px border on the image it saved it as a 9-patch PNG instead of a normal PNG file. Or maybe it was due to the blur effect that was on the image. I'm not too sure, but, I do know that once I took off the blur effects and removed the border it did work.
I hope this is useful for anyone who might be faced with a similar problem!

Fit a ImageView (and its src) to the layout width and make its height proportional

Can you help me to configure my layout? I don't achieve what I'm looking for:
I've put the imageview background to red for explain what I want:
The image's width is smaller than the layout width. I'd like the image grow proportionally keeping its aspect ratio until reach the aspect at the first image (I modified it manually with photoshop) but when setting width="fill_parent" the result is the second image and setting both width and height to "fill_parent" the result is the third image.
I tried to combine with ScaleType with no success
How can I achieve the first option? Thanks
Use android:adjustViewBounds=true attr in xml for ImageView
This question is solved here by extending the ImageView class.
Android ImageView adjusting parent's height and fitting width
I created a sample. It works for me. Here is the xml layout file.
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical" android:layout_width="fill_parent"
android:layout_height="fill_parent">
<ImageView android:src="#drawable/hydrangeas"
android:layout_height="wrap_content" android:id="#+id/imageView1"
android:scaleType="centerInside"
android:adjustViewBounds="true"
android:background="#android:color/white"
android:layout_width="wrap_content"/>
</LinearLayout>
It works for fitCenter too. Have a look at the snapshot.
Use the attribute fit_center into your ImageView tag.
<ImageView ... android:scaleType="fitCenter" .. />

Categories

Resources