ImageView With Button inside - android

I want to do the imageView layout with the button to edit photo inside.
I think to put image as imageView background but i donĀ“t know how to do the semicircle transparency and set the icon.
Any ideas?
UPDATE
Now i have this.
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical" android:layout_width="150dp"
android:layout_height="150dp"
android:background="#color/blue_bar">
<de.hdodenhof.circleimageview.CircleImageView
android:id="#+id/image"
android:scaleType="centerCrop"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:src="#color/black"/>
<ImageButton
android:layout_alignStart="#+id/image"
android:layout_alignEnd="#+id/image"
android:src="#drawable/ic_edit_photo"
android:layout_alignParentBottom="true"
android:layout_width="match_parent"
android:layout_height="40dp"
android:background="#B3ffffff"/>
</RelativeLayout>
Can i do the imageButtons background as a semicircular shape?

For that you have to make a CompoundView.
1) I would make a RelativeLayout with the imageview width and height set to match_parent, then a button with alignBottom set to true.
2) Then keep using your button normally in your Activity.
3) You can go fancier and use a CompoundView extending ViewGroup and putting the functionality of the button.
Here is a tutorial for it:
http://www.vogella.com/tutorials/AndroidCustomViews/article.html
I hope it helps.

Related

Image size - how to?

I just want to make a simple image view but when I run that app the unnecessary white background comes. I don't want to need that part. any solution.
and here is my xml file for that image view
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="vertical">
<ImageView
android:id="#+id/imageView"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:gravity="center"
android:src="#drawable/pot1"/>
</LinearLayout>
In code use -
imgview.setScaleType(ScaleType.FIT_XY);
Or in xml Image view -
android:scaleType="fitXY"
remove the gravity attribute if you want to make it stick to the top of screen or add scaleType attribute fitCenter, cropCenter or fitXY if you want to make it fill the screen.

how to change relative layout shape similar to image in android

I have an cup shape image.
i want to change my relative layout exactly same as my imageview,
is it possible in android?
Any help?
Thanks
Change layout like this image
Imageview
Use ImageView in RelativeLayout set imageview to
imageView.bringToFront();
Hope this helps :
<RelativeLayout
android:id="#+id/root"
android:layout_width="match_parent"
android:layout_height="300dp"
android:layout_below="#id/rel_actionbar"
android:layout_margin="10dp"
android:padding="4dp">
<RelativeLayout
android:id="#+id/rel_screenshot"
android:layout_width="match_parent"
android:layout_height="300dp">
<ImageView
android:id="#+id/img_to_print"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_centerHorizontal="true"
android:layout_centerVertical="true" />
</RelativeLayout>
<ImageView
android:id="#+id/img_tshape"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_centerHorizontal="true"
android:layout_centerVertical="true"
android:scaleType="fitXY"
android:src="#drawable/img_t"
android:visibility="visible" />
</RelativeLayout>
Set imgTShape.bringToFront(); In java file As Milan Suggested and use Transparent image for this.
Use relScreenShot.addView(imgPrint, 0); to add view dynamically inside the layout and set image in imgprint that will remain inside the root layout only.
For what purpose do you want your layout like to be so?
In one word, it's impossible.
Android View must be Rectangle shaped although they can store non-rectangle shape images inside.

How to adjust Layout backgroud image to centerInside?

When assigning an image as a background to a Layout(Linear || Relative) it stretched all over the Layout, but I want to make that background image to be centered inside the Layout as in the ImageButtons :
android:scaleType="centerInside"
Is there's a way to achieve that in Linear or Relative Layouts?
You should try the....
1.) take the RelativeLayout propery matchParent both. and centerInparent=true
2.) take one ImageView inside it Property WrapContent.
now take the background or src of inage view
you can use another layout LayoutB inside the LayoutA. and set the width and height to wrap_content of LayoutB..and set the image to background of LayoutB..and also set the arributs like this:
android:layout_height="wrap_content"
android:layout_width="wrap_content"
android:layout_gravity="center"
This will help you
<?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/someImage"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerInParent="true"
android:src="#drawable/someImageSrc" />
</RelativeLayout>

Overlay over an ImageView on Android

So I have a list of images that come from the web, I don't know which color are they and I want to place a text over the ImageView.
My idea is to place the ImageView, an image overlay with transparency gradient over that ImageView and the text above it. I want to mimic this behaviour:
Is there anyway to do this via XML?
When you write the XML for your list items which get inflated in the getView(...) of whatever ListAdapter you've written you can surely do this.
Something like this for the list item:
<?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:layout_width="320dp"
android:layout_height="240dp"
android:background="#ACACAC"/>
<RelativeLayout
android:layout_width="320dp"
android:layout_height="240dp"
android:background="#drawable/gradient">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Here is your text"
android:textColor="#000000"
android:layout_alignParentBottom="true"/>
</RelativeLayout>
</RelativeLayout>
Then you create that drawable/gradient. For that you can recycle the answer from here.
Thanks to adityajones I managed to get there :)
So although this is my right answer, I'll mark his as the correct one!
<?xml version="1.0" encoding="utf-8"?>
<ImageView
android:layout_width="fill_parent"
android:layout_height="200dp"
android:scaleType="centerCrop"
android:src="#drawable/image" />
<RelativeLayout
android:layout_width="fill_parent"
android:layout_height="200dp"
android:background="#drawable/gradient_image" >
<TextView
android:id="#+id/text"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_alignParentLeft="true"
android:layout_margin="6dp"
android:layout_marginBottom="18dp"
android:shadowColor="#000"
android:shadowRadius="7.0"
android:text="This is some random text"
android:textColor="#color/white"
android:textSize="22sp" />
</RelativeLayout>
I'd use a FrameLayout or RelativeLayout. The first View you add to either should be the background ImageView, then obviously you'll need some TextViews and Other ImageViews [or Buttons, or ImageButtons, etc]
Seems like a reasonable layout: a background image, and then one additional view in each corner.
For the gradient, you'll probably want a separate Layout/View at the bottom with a gradient drawable as the background, although I can imagine you might be able to get away with setting the background of one of your TextViews as the gradient.
You do not have to use a gradient drawable file or set it in your xml..
you can do this pragmatically using GradientDrawable Class as explained in this related Question (Create a radial gradient programmatically) then set it as a background for a layout that covers your ImageView, this gives you ability to use different colors and orientations

How to add overlay view over other view in android?

I want to put button above image view.
How can i do this?
(Please, don't offer to set Background, cause i need ImageView)
Set as background!
Just kidding... what you need is put your views inside a RelativeLayout. Something like will work:
<?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">
<ImageView
android:layout_alignParentTop="true"
android:layout_alignParentLeft="true"
android:layout_width="fill_parent"
android:layout_height="fill_parent"/>
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_alignParentBottom="true"
android:text="blah blah"/>
</RelativeLayout>
Notice the use of params like layout_alignParentLeft which are used to position the view where you want.
I agree with #Cristian's answer. but also,
If you need button's action listener you can add onClick method to your imageView without using button.
And also ImageButton. I hope this answer shows some path to solve your problem.
Worked for me with both ImageView and Button inside RelativeLayout:
<Button android:layout_centerInParent="true">
...

Categories

Resources