Full Screen ImageButton - android

I trying to create a full screen Imagebutton. But i kept getting grey border ard it.
<ImageButton
android:id="#+id/StartButton"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:src="#drawable/startscreen" />
I have try stretch the pic to full screen on eclipse but there still show a grey border around the picture.
I was wondering is that due to the resolution of my setting or the picture resolution. I am working on a galaxy note.

this should remove the grey border
<ImageButton
android:id="#+id/StartButton"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:src="#drawable/startscreen"
android:background="#000000"/>

The idea of #Proxy32 is probably the best one. Alternatively don't use the android:src attribute but the android:background. You can also use a simple Button instead with the background set to your drawable and leave the text out.

Related

Imageview left and right white space issue

I'm trying to set 1080*1920 image in imageview but it showing white space left and right side. It showing same in all device having resolution of 480*800,720*1280,768*1280,1080*1920,1440*2560. Please check attached image Also, i tried to set android:adjustViewBounds="true" but it didn't work if i set android:scaleType="fitXY" image is streched. Please help me with some solution as i'm trying all possible way but not worked till now.
This is xml layout code :
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent">
<ImageView
android:id="#+id/img_gallery1"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:adjustViewBounds="true"
android:src="#drawable/atest"
android:scaleType="fitXY" --> iF i use fitXY then image is streched
android:visibility="visible" />
</RelativeLayout>
Try:
android:layout_width="wrap_content"
or:
android:layout_width="match_parent"
also make sure whichever container you have the imageview inside is able to fill the full screen.
The resolution you mentioned i.e 1920x1080 is ideally a landscape resolution.
So if you intend to put the image in portrait mode, then try changing the resolution of image to 1080x1920.
Also, as Philip said, make sure the imageview's container is able to fill the screen.

How to remove paddings in a 9-patch background for textview

I have a textview which has to use a 9-patch drawable as the background. But the 9-patch drawable has left and right paddings which make the background image not stretch properly to cover the whole text. I tried resetting the paddings for the textview itself but it doesn't fix the problem.
Would anyone have any idea how to make it work?
Thanks.
The black lines on the left and top defines the stretchable are, and those on the right and bottom marks the "content" area in a 9-patch image.
So, if you don't want padding means you want a full-length content area. You should mark full-width content area by drawing a full-length line at the bottom and right of the 9patch image.
In this image, the black lines on the right and bottom represent the content area. You can see the preview on the right side, and notice the content area in light blue color. You can fill the content area by extending the bottom and right lines.
Editing 9-patch file is not a good idea, because this method may deform the background image.
I used a trick to handle this:
<RelativeLayout
android:layout_width="fill_parent"
android:layout_height="wrap_content">
<View
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_alignBottom="#+id/textView"
android:layout_alignTop="#+id/textView"
android:background="#drawable/your_9_patch_image"/>
<TextView
android:id="#+id/textView"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:text="a custom text!"/>
</RelativeLayout>
I have set the 9-patch background drawable for a View behind my TextView in a RelativeLayout. So the there is no unwanted padding :)
Theoretically you cant really change the padding of 9 patch image programatically.
So you have two options:
1) Have several 9 patch images in your drawable folder for each resolution: drawable-hdpi, drawable-xhdpi etc
2) Embed a inner layout:
<RelativeLayout
android:background="#drawable/nine_patch_image_without_padding"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<LinearLayout
android:layout_margin="10dp" // Your padding goes here
android:layout_width="match_parent"
android:layout_height="wrap_content">
<TextView
android:text="How you doing"
android:layout_width="match_parent"
android:layout_height="wrap_content" />
</LinearLayout>
</RelativeLayout>
It worked for me. I use the second options as it is simpler and quicker to use :)

How can clear ImageButton's background?

I have a ImageButton with default drawable image. From the code I set up the ImageButton layout size so after this modification the image doesn't cover the whole button because of centerInside scaleType. In the OnClick event I use this code to replace the ImageButton's image.
button.setImageBitmap(img);
button.invalidate();
The new image is smaller than the old one. After replace the new image appears but the old image parts can be see around the new. How can I force to clear the old image or simply redraw the whole ImageButton to show only the new image?
<ImageButton
android:id="#+id/btnPhotoFront"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_margin="3dp"
android:layout_weight="1"
android:background="#android:color/transparent"
android:contentDescription="#string/front"
android:scaleType="centerInside"
android:src="#drawable/camera" />
I tried with android:background="#00000000" but has no effect.
The repaint works only if I don't set up background and leave the default gray button layer.
Try
android:background="#null"
Also note that you are setting two different properties. setImageBitmap is not the corresponding method for android:background
b.setBackground(drawable)
b.setImageBitmap(bm);
I bet your
android:src="#drawable/camera"
image file does not have a transparent background. Use Photoshop or GIMP or something similar, cut out your image and put it on a transparent background.

Why is my imageview transparent/not showing properly?

I am really confused about this.I have set the background color of the whole screen to blue and I have a framelyout with image view under it. When I choose playingcard drawable as its source then the white background of the playing card is becoming blue and the image is not clear. Why is this happening?
Below is what the screen is looking like:
.
My image is :
:
And here is Part of the XML code:
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:background="#0000FF" >
<FrameLayout
android:id="#+id/frameLayoutBottom"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_centerHorizontal="true" >
<ImageView
android:id="#+id/ivBottom2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:paddingLeft="10dp"
android:src="#drawable/c11"/>
I don't want to set the background of image to white as I am using padding and I don't want the padding to be white.. The weird thing is that if I use other images that are say red then it shows perfectly, it is just when I use playing cards (I have 52 cards), it is showing like that
Any help please?
Thank you.
Your image has transparent pixels. Use an image editor to convert them to white.
Alternatively, you can specify a margin instead of padding and setBackgroundColor() on your ImageView.

Maintain circle image ratio for button on varying screen resolutions

I have an image button with a background image .png of a circle. I am testing it on different resolution screens and it looks different on every one. Most of them distort the circle shape by stretching it on one dimension.
What is the correct way to handle this? I am familiar with the 3 density levels needed for the highest quality image, but I think the problem is with the layout type attributes on either the image button itself or the parent container.
Snippet from main.xml...
<LinearLayout
android:id="#+id/buttonArea"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_weight="1"
android:orientation="vertical"
android:padding="30dp">
<ImageButton
android:id="#+id/button1"
android:background="#drawable/button_inactive"
android:layout_height="wrap_content"
android:layout_width="wrap_content"
android:layout_gravity="center"/>
</LinearLayout>
removing the layout_weight attribute from the ImageButton fixed most cases, but not all. It seems that the padding is still changing the ratio of the circle. Scale types have no effect. Is it because my image is set as the background and not the src?
I think android:layout_weight="1" in your ImageButton is the cause of this. It will make your ImageButton the same size of your screen, no matter what size the screen is.
Try to remove that attribute. If that doesn't fix your problem, have a look at android:scaleType attribute
<ImageButton
android:id="#+id/button1"
android:layout_height="fill_parent"
android:layout_width="fill_parent"
android:layout_gravity="center"
android:background="#null"
android:src="#drawable/button_inactive"
android:scaleType="centerInside"/>
You can set the scaleType attribute of your ImageView, to one that keeps the aspect ratio of your image.
They all behave slightly different, so you'll have to use one that suits your needs (CenterInside is a good one to start with).
If this doesn't work, you can always specify set heigh/widths of your image (e.g. layout_width="128dp).

Categories

Resources