I have an imageview with a default image already set from the xml, and I want to change it's image pragmatically so that the new image will scale to the previous image size, both of the images are rounded.
I have tried setting the scaleType attribute to different values before setting the new image but it didn't work.
This is the xml:
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent" >
<ImageView
android:id="#+id/up_right_circle_firstiv"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerInParent="true"
android:scaleType="fitXY"
android:src="#drawable/circle_medium_up" />
This is the activity code:
public class MainActivity extends Activity {
ImageView middleCircle;
#Override
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
middleCircle = (ImageView) findViewById(R.id.up_right_circle_firstiv);
middleCircle.setImageResource(R.drawable.round_pic_one);
}
}
Inside the activity.
I have uploaded the screenshots:
http://imgur.com/OM79T
http://imgur.com/G7y3Q
The solution that I have found was setting the layout_width and layout_height to a default size.
First I took the size of the original image file, then I have converted it to dp.
http://labs.skinkers.com/content/android_dp_px_calculator/
I had different image sizes for each resolution.
And then my xml looked something like this :
<ImageView
android:id="#+id/up_right_circle_firstiv"
android:layout_width="33dp"
android:layout_height="33dp"
android:src="#drawable/circle_medium_up" />
I only changed the dp values for each layout.
I know it is not the best solution but it worked for me.
Related
I am using SVGImageview for displaying SVG image but it is not occupying the whole screen as shown below:
public class MainActivity extends AppCompatActivity {
#Override
protected void onCreate(Bundle savedInstanceState) {
AppCompatDelegate.setCompatVectorFromResourcesEnabled(true);
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
//ImageView imageView = (ImageView)findViewById(R.id.imageView);
//imageView.setScaleType(ImageView.ScaleType.FIT_CENTER);
//imageView.setAdjustViewBounds(true);
}
}
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context=".MainActivity">
<com.caverock.androidsvg.SVGImageView
android:id="#+id/imageView"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:src="#drawable/ic_load_bg"
android:scaleType="fitXY">
</com.caverock.androidsvg.SVGImageView>
</LinearLayout>
Can someone help me how to do this for any screen size? I found this link to be similar to what I am trying to do here but it didn't give me any hints.
Looking at
https://github.com/BigBadaboom/androidsvg/blob/master/androidsvg/src/main/java/com/caverock/androidsvg/SVGImageView.java
It seems it is looking for "app:svg" attribute instead of "android:src". Also looking for some css to create picture object which is rendered.
private void doRender()
{
if (svg == null)
return;
Picture picture = this.svg.renderToPicture(renderOptions);
setSoftwareLayerType();
setImageDrawable(new PictureDrawable(picture));
}
One more helpful link is http://bigbadaboom.github.io/androidsvg/SVGImageView.html
Additional info: Android has tools like LayoutInspector to inspect layout. Through studio you can convert you svg file to different format, and can use Image view directly the way you are doing.
I have a large .png and i want to show it in a Splash screen, but the image is not showing. The xml:
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools" android:layout_width="match_parent"
android:layout_height="match_parent" android:paddingLeft="#dimen/activity_horizontal_margin"
android:paddingRight="#dimen/activity_horizontal_margin"
android:paddingTop="#dimen/activity_vertical_margin"
android:paddingBottom="#dimen/activity_vertical_margin"
tools:context="com.infaplic.lpi.activities.SplashActivity">
<ImageView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:id="#+id/imageView2"/>
And the code of the Activity:
public class SplashActivity extends Activity {
ImageView imagen;
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_splash);
imagen=(ImageView)findViewById(R.id.imageView2);
imagen.setImageDrawable(getResources().getDrawable(R.drawable.pantalla_arranque));
new Handler().postDelayed(new Runnable() {
#Override
public void run() {
Intent mainIntent = new Intent(SplashActivity.this, NextActivity.class);
SplashActivity.this.startActivity(mainIntent);
SplashActivity.this.finish();
}
}, 1000);
}
}
This way, the image is not showing. I have tried with android:src: in the xml, but it doesn't work.
The image is very large. Do I need to resize it before putting it in the ImageView? If not, why is the image not showing?
Thank you.
EDIT: The PNG is 1080x1920
In my case I was using a image with file name like "go-back-filename.png". And xml file is like
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/go-back-icon"/>
After i changed the file name to "go_back_icon" it worked fine.
Hope this helps someone.
Since you write that your image is very large I would guess it is too large. I have a bug in one of my apps there I generate an image which is bigger then 2048 pixels. Some devices does not support such big images I would guess that you run into a similar problem.
If that is some background image reduce the image size, a background image is not so important that each pixel on the screen has to own a image pixel.
Add Below this. Please read Options for scaling the bounds of an image to the bounds of this view.ImageView.ScaleType in your ImageView
Use This
imagen.setImageResource(R.drawable.pantalla_arranque);
Then
<ImageView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:id="#+id/imageView2"
android:adjustViewBounds="true"
android:scaleType="fitXY"/>
android:adjustViewBounds : Set this to true if you want the ImageView to adjust its bounds to preserve the aspect ratio of its drawable.
Must be a boolean value, either "true" or "false".
Please Check demo ImageView scaleType Samples . I hope it helps you
Change your ImageView to this :
<ImageView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:id="#+id/imageView2"
android:scaleType="fitXY"
android:adjustViewBounds="false"/>
If it's not working try to add this on your manifest (inside your Activity) android:hardwareAccelerated="false"
EDIT
I was looking for the answer, but I thought that better try it by my self... and I've created a sample project where I use an ImageView 1080x1920 and I was testing since I've found that I've I put 3000 miliseconds it shows up... wiht 1000 miliseconds won't show up if you don't rescale it.
By the way getDrawable() is deprecated I recomend to you use :
imagen.setImageDrawable(ContextCompat.getDrawable(getApplicationContext(), R.drawable.imagenprueva));
XML
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent" android:layout_height="match_parent"
>
<ImageView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:id="#+id/imageView2"
android:adjustViewBounds="true"
android:scaleType="centerCrop"
android:background="#drawable/imagen"
/>
</RelativeLayout>
Here's the full source code hope it helps Source code
In your .xml file
add
xmlns:app="http://schemas.android.com/apk/res-auto"
then in the ImageView add this line of code:
app:srcCompat="#drawable/books"
NOT
tools:srcCompat="#drawable/books"
Allow me to explain. I have :
a button with picture (located at #drawable/pic),
linear layout (id=linear1)
the button xml is below :
<ImageButton
android:id="#+id/imageButton1"
android:layout_width="80dp"
android:layout_height="80dp"
android:layout_marginRight="10dp"
android:scaleType="fitXY"
android:src="#drawable/pic"
android:maxWidth="80dp"
android:maxHeight="80dp"
tools:ignore="ContentDescription" />
the linear layout xml is as follow :
<LinearLayout
android:id="#+id/layout1"
android:layout_width="match_parent"
android:layout_height="80dp"
android:gravity="center"
android:orientation="horizontal"
tools:ignore="UselessLeaf" >
what i want is, when i click the button i want to create/generate imageview programatically inside the linearlayout and i want to fill it with the same picture for the button (pic). The code is below :
//initiate imageview
ImageView img=new ImageView(this);
//get drawable from button
Drawable blabla=btn1.getDrawable();
//set drawable to imageview
img.setImageDrawable(blabla);
//set height and width of imageview to 50dp
LinearLayout.LayoutParams parms = new LinearLayout.LayoutParams(50,50);
img.setLayoutParams(parms);
img.setScaleType(ScaleType.FIT_XY);
//place imageview to linearlayout
layoutTempat.addView(img);
The code works fine with displaying the imageview with the same image as the button have.
however the problem is : when i set the imageview to 50dp programatically, the image inside button changed too.. how can it happened ? i am so confused as iam a newbie..
Thanks before.
The two views are sharing the same drawable.
It's plausible your manipulations on one view are being sent to the underlying drawable, effecting how its displayed in the other view -- frankly I don't know. But assuming the case is as you described, this problem is easily fixed by cloning the drawable as follows:
Drawable dr = btn1.getDrawable().getConstantState().newDrawable();
img.setImageDrawable(dr);
I have my imageview declared like this:
<ImageView
android:id="#+id/category_image_top"
android:layout_width="match_parent"
android:layout_height="170dp"
android:maxHeight="170dp"
android:adjustViewBounds="true"
android:scaleType="centerCrop"
android:background="#drawable/image_placeholder"
/>
And this is how I set my category_image_top in asynctask (on onPostExecute)
imageView.setImageBitmap(image);
When image is set, imageview suddenly gets a margin of 4px. But when I remove android:background="#drawable/image_placeholder" from XML everything is fine?!
BTW: image_placeholder is a 9-patch image, if this makes any difference.
Any ideas why this happens?
UPDATE: I've tried placing background as a solid color and then no margins appear when image is loaded. I've also tried placing another 9-patch image and when I do so margins appear again. So it must be something with background as an image
UPDATE2: Maybe it's an android bug like this guy points out? https://stackoverflow.com/a/8340745/581531
I can guess that image_placeholder has 4px transparent margin
OK. Solution was found, maybe it's not the prettiest one but hey, it work! :)
In my view I've just added an arbitrary View that is a holder for my image. On top of it i have my ImageView so when the image is loaded placeholder (View) get covered. This is my view (or at least part that matters):
<FrameLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
>
<View
android:layout_width="match_parent"
android:layout_height="210dp"
android:background="#drawable/image_placeholder"
/>
<ImageView
android:id="#+id/article_image"
android:layout_width="match_parent"
android:layout_height="210dp"
android:adjustViewBounds="true"
android:layout_gravity="center"
android:scaleType="centerCrop"
/>
...
The element that contains the image view may have a margin, have you checked that?
Change android:background="#drawable/image_placeholder" to android:src="#drawable/image_placeholder"
Also add the following: android:scaleType="centerCrop"
If centerCrop doesn't work, try the other ones listed here.
I have a LinearLayout with width set to fill_parent and height to wrap_content. Now I want to give it a background from a png file, but doing it in a traditional way causes the LinearLayout to resize in order to show the whole background instead of cropping the additional part.
How can I set the background of LinearLayout so it won't resize?
Thanks
It appears that such thing is achievable only using the ImageView and setting the scaleType parameter accordingly. A quick workaround is to use FrameLayout and put the ImageView under another layout with transparent background.
Code:
<FrameLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent">
<ImageView
android:id="#+id/imageView1"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:scaleType="centerCrop"
android:src="#drawable/background" />
</FrameLayout>
The default behaviour of background bitmaps is to fill the container completely and grow the horizontal and vertical size of the container if needed. The solution is to create a drawable bitmap resource and changing the gravity.
Check the following link and look for the possible gravity values. Your view should then just reference the drawable resource and you should be fine.
http://developer.android.com/guide/topics/resources/drawable-resource.html#Bitmap
I solved this one by subclassing LinearLayout and overriding the onMeasure(int,int) callback, then updating the layout XML to use my new layout type. I'm not at liberty to post that exact code, but what I did was invoke the super.onMeasure(int,int) implementation and check whether the measured height came back as the exact height of my background image. If so, I grab the measured height of all child views, then calculate a new height value and pass it to setMeasuredDimension(int,int).
put this code in the xml activity, for example activity_main.xml
<ImageView
android:id="#+id/imageView1"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:scaleType="centerCrop"
android:src="#drawable/image" />