I have to take a picture in my App. After take it , I have to show it in a ImageView, so I decided to use Glide as library to handle it.
I have set the code like this:
Glide.with(this)
.load(mLastPhoto)
.fitCenter()
.centerCrop()
.into(iv_circ_image);
and the xml file looks like:
<ImageView
android:id="#+id/circ_image"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="#+id/bTakePicture"
android:layout_marginLeft="20dp"
android:layout_marginRight="20dp"
android:layout_marginTop="12dp"
android:src="#drawable/ab_background_textured_" />
But when the phot has been taken, the image is shown like this:
How I have to set the Glide code or the XML to show all the image?
Add the android:adjustViewBounds="true" attribute to your ImageView. Set this to true if you want the ImageView to adjust its bounds to preserve the aspect ratio of its drawable (from API-Documentation http://developer.android.com/reference/android/widget/ImageView.html).
<ImageView
android:adjustViewBounds="true"
android:id="#+id/circ_image"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="#+id/bTakePicture"
android:layout_marginLeft="20dp"
android:layout_marginRight="20dp"
android:layout_marginTop="12dp"
android:src="#drawable/ab_background_textured_" />
In the xml you have android:layout_height="wrap_content" and android:layout_marginTop="12dp"
Then in the java you have .fitCenter().centerCrop().
So basically you have a 12dp image view that Glide is filling. I suggest you set the height of the image view (ie 200dp) or have the buttons stick to the bottom of the screen and have the imageview fill the available space between them.
Related
I'm using Glide library to get user's profile image from url and display it in ImageView view.
I want to set camera icon on the right side of that profile image exactly like below.
Here is my imave view:
<ImageView
android:id="#+id/imageView"
android:layout_width="50dp"
android:layout_height="50dp"
android:layout_marginTop="700dp" />
Glide:
ImageView imageView = findViewById(R.id.imageView);
Glide.with(imageView)
.load(URL)
.circleCrop()
.placeholder(setCircularImage(R.drawable.prof))
.error(setCircularImage(R.drawable.t))
.fallback(setCircularImage(R.drawable.camera_red))
.into(imageView);
How could I do that, Whic library should I use to make camera icon on the right side of a profile image ?
I don't want the icon overlap the profile image. I want the profile image to be cropped to give place to camera icon(Like on facebook app profile image). Thanks.
Thanks.
There is nothing to do with Glide. You can use ConstraintLayout, FrameLayout or RelativeLayout to overlap ImageViews.
you can use Relative layout to achieve this like below
<RelativeLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content">
<ImageView
android:id="#+id/imageView"
android:layout_width="50dp"
android:layout_height="50dp"
android:src="#drawable/ic_launcher_background"
android:layout_marginTop="700dp" />
<ImageView
android:layout_width="wrap_content"
android:layout_alignBottom="#id/imageView"
android:layout_alignEnd="#id/imageView"
android:layout_height="wrap_content"
android:bott="true"
android:src="#drawable/abc_vector_test"
/>
</RelativeLayout>
and then adjust it accordingly.
Happy coding :)
first you should use circleImageView in your layout and then set two of them like this:
<CircleImageView
android:id="#+id/circleImg1"
android:layout_width="50dp"
android:layout_height="50dp"/>
<CircleImageView
android:id="#+id/circleImg2"
android:layout_width="15dp"
android:layout_alignBottom="#id/circleImg1"
android:layout_alignEnd="#id/circleImg1"
android:layout_height="15dp"/>
I have an image button with the following xml:
<ImageButton
android:id="#+id/imageButton1"
android:contentDescription="#string/button_click1"
android:layout_width="200dp"
android:layout_height="100dp"
android:layout_margin="20dp"
android:src="#drawable/button_default" />
Now I want to dynamically change the image source from loading a file. I know the right way is to use
this.button.setImageDrawable(this.default_source);
The problem is I want to make sure two things:
1. The new image should be in the same place as before replacing.
2. If the newly loaded image is not 200dp * 100dp, I want automatically scale the
image not cutting it. Any idea how to do this?
Thanks a lot!!!
Put the following xml attribute into your ImageButton xml...
android:scaleType="fitXY"
as below...
<ImageButton
android:id="#+id/imageButton1"
android:contentDescription="#string/button_click1"
android:layout_width="200dp"
android:layout_height="100dp"
android:layout_margin="20dp"
android:scaleType="fitXY"
android:src="#drawable/button_default" />
I have to show circular profile picture with border around it. I have a background image for border. I am setting image "src" with padding of 3 dp.
My Image view in XML looks like:
<ImageView
android:id="#+id/pic_iv"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#drawable/blank_avatar"
android:padding="3dp"
android:scaleType="fitXY"
/>
I am setting image to this image view using "setImageBitmap(Bitmap bitmap)" programatically.
I googled and tried setting property
android:cropToPadding="true"
but this is also of no use. Padding is being ignored. so no border is shown around image.
Any help will be highly appreciated.
this is what i have done to make the borders
1st - in the layout file i did the following :
<ImageView
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:src="#drawable/ic_launcher"
android:background="#123456"
android:padding="10dp"
android:id="#+id/imageView"
android:scaleType="fitXY"/>
2nd - in my activity i used the same method you are using to change the image "setImageBitmap(bitmap)" like the following :
ImageView imageView = (ImageView)findViewById(R.id.imageView);
Bitmap bitmap = BitmapFactory.decodeResource(getResources(), R.drawable.aaaa);
imageView.setImageBitmap(bitmap);
and i got a image with the padding around it with 10dp like the image attached.
Hope that helps .
Change properties of ImageView android:scaleType="fitXY" to android:scaleType="center" or android:scaleType="fitCenter" and try again .
Hope this will work .
i have this little layout i defined to inserted in every page of my app:
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<ImageButton
android:id="#+id/button"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
android:layout_centerVertical="true"
android:layout_marginRight="10dp"
android:background="#null"
android:src="#drawable/sa_info"
android:layout_alignParentRight="true"/>
i've sa_info.png that is 118x118 but i want it to look much smaller on the screen. if i try to set width and height of the imagebutton to the desired size (lets say 48dp) the resulting image when i run the app is cropped to the center:
so the only way i have to get the desired result is scale the image itself to the desired resolution.
what i'm doing wrong, is there a better way to do this?
Try adding
android:scaleType="fitCenter" -> http://developer.android.com/reference/android/widget/ImageView.ScaleType.html
android:adjustViewBounds="true" -> Set this to true if you want the ImageView to adjust its bounds to preserve the aspect ratio of its drawable.
I've look at MANY questions on Stackoverflow and tried many workaround but it still didn't work.
What I wanna achieve :
Yet I am achieving this :
This is my current xml code:
<ImageView
android:id="#+id/image"
android:layout_width="fill_parent"
android:layout_height="match_parent"
android:layout_below="#+id/text"
android:layout_gravity="center"
android:adjustViewBounds="true"
android:scaleType="centerInside"
android:src="#drawable/ic_action_search" />
The best way to achieve this is to scale the image (bitmap) using a Matrix.
An alternative is to use a library I previously created which does this for you:
https://github.com/laurencedawson/ZoomableImageView
This will automatically scale the image to fit the screen and also add pinch to zoom.
add
<ImageView
android:id="#+id/image"
android:layout_width="fill_parent"
android:layout_height="match_parent"
android:layout_below="#+id/text"
android:layout_gravity="center"
android:adjustViewBounds="true"
android:scaleType="fitXY"
android:src="#drawable/ic_action_search" />
CenterInside, Resize Image According To view dimensions and its Resolutions. So if an Image Has size of 300*450 and we have set this image to an imageview of scale type centerinside, with dimensions 200*400, then it will make size of image to 200*300, According to the target dimensions, so scaling it down make 200 is minimum in width and height. I hope I am clear enough. In cases where you need to set dimensions of exact size use FItXY, as suggested by Adeel.
You want to do it inside the XML file right?
<ImageView
android:layout_width="size of image (in density pixels)"
android:layout_height="size of image (in density pixels)" />
so for example:
<ImageView
android:layout_width="60dp"
android:layout_height="60dp" />