I have two different images and would like to set them using different views but overlap slightly to match the below images. I also want to be able to set a different OnClickListener for each of them. I know with iOS I can set the view positions using x and y values but I'm not sure how to do this in Android.
How can I go about doing this?
Desired result:
Image One
Image Two
Try set those two images as ImageView's and put them inside a FrameLayout. That way you can set them as you want, So they can overlap one another. That way you can set an clickable and onClick properties for both of them separately:
<?xml version="1.0" encoding="utf-8"?>
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical" >
<ImageView
android:id="#+id/iFirstImage"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:contentDescription="#drawable/sort_image_1"
android:clickable="true"
android:onClick="setFirstImageClick"
android:src="#drawable/sort_image_1" />
<ImageView
android:id="#+id/iSecondImage"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:contentDescription="#drawable/sort_image_2"
android:clickable="true"
android:onClick="setSecondImageClick"
android:src="#drawable/sort_image_2" />
And create methods setFirstImageClick and setSecondImageClick in your activity to decide what each image click should do.
You can place the first image however you want, and then in the xml for the second image use
android:layout_toRightOf="firstImageId"
You can set each onClick separately after that.
Related
I would like to use getLocationOnScreen to get the location of an ImageView, and then I would like to place another ImageView exactly at that place.
Assume they both are in the same layout. When the app starts only imgv1 is visible. The user can move and rotate that image. Then the user can press a button and second image, imgv2 should be placed exactly on top of imgv1 so it covers it. Both imgv1 and imgv2 have the same size.
For example, assume I have imgv1 and imgv2 as:
ImageView imgv1, imgv2;
int[] img_coordinates = new int[2];
imgv1.getLocationOnScreen(img_coordinates);
I wanted to use something like:
imgv2.setX(img_coordinates[0]);
imgv2.setY(img_coordinates[2]);
but this doesn't do what I need to do, which is to place the top left corner of imgv2 on the top left corner of imgv1.
Any other method that helps me to do so is fine too.
** Update **
This is the layout I have:
<?xml version="1.0" encoding="utf-8"?>
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:id="#+id/tools_root"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#android:color/transparent">
<ImageView
android:id="#+id/imgv1"
android:layout_width="300dp"
android:layout_height="200dp"
android:layout_gravity="center_vertical|center_horizontal"
android:visibility="gone"
app:cameraCropOutput="true"
app:cameraPlaySounds="false" />
<ImageView
android:id="#+id/imgv2"
android:layout_width="300dp"
android:layout_height="200dp"
android:adjustViewBounds="true"
android:scaleType="fitXY"
android:visibility="gone" />
</FrameLayout>
The javadoc for view says that setX and setY will offsett the image from it's original location. It looks like what you want to use is setLeft and setTop.
https://developer.android.com/reference/android/view/View#setleft
If i have overlapping views I generally put them in layout and show/hide them. However if you want to dit via code try setting layout params of second image like:
lp.addRule(RelativeLayout.ALIGN_LEFT, image1.getId());
lp.addRule(RelativeLayout.ALIGN_TOP, image1.getId());
...something like it.
Positioning depends a lot on parent of Image views. Relative Layout would be correct choice.
Step #1: Put imgv1 in a FrameLayout
Step #2: Put imgv2 in that same FrameLayout, with android:visibility="gone"
Step #3: When the user presses the button, call imgv2.setVisibility(View.VISIBLE)
<FrameLayout android:id="combined">
<ImageView android:id="imgv1" android:layout_width="match_parent" android:layout_height="match_parent" />
<ImageView android:id="imgv2" android:visibility="gone" android:layout_width="match_parent" android:layout_height="match_parent" />
</FrameLayout>
Missing are sizing/positioning rules for the FrameLayout, which would be whatever you are presently using for your starting conditions for imgv1, presumably.
Alternatively, have one ImageView, rather than two, and change the image on the button click. For example, you could use a LayerDrawable (or the equivalent resource) to layer two drawables on top of each other, and show that.
I'm trying to make AppWidget shows rotation images which can automatically change every 5 seconds,and I think ViewFlipper might be able to reach this goal.
But I get images from server and can't just put them as ImageView in .xml file under nested ViewFlipper like this:
<ViewFlipper android:id="#+id/viewflipper"
android:layout_width="match_parent"
android:layout_height="match_content"
android:autostart="true"
android:flipinterval="5000" >
<ImageView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:src="#drawable/drawable1"/>
<ImageView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:src="#drawable/drawable2"/>
</ViewFlipper>
I need to add images dynamically, and shows one picture at one time. If there's more than one image, they need to be shown on AppWidget by turns.
Hope somebody could help me with this, thanks!
I assume by "dynamically" you mean there could be an arbitrary number of items. What you probably want is AdapterViewFlipper. You can follow this guide for building an AppWidget whose content is backed by an adapter.
So, i wanted to put an image in background of my screen. My problem is that if i just add the image to "background" it will fill all the screen, and my image gets defaced. I could put as an ImageView, but the problem is that i have an expandableListView in the same screen, and i wanted the image to stay behind, as a background.
Any idea how to do this?
Can have 2 solutions: Put as an imagemView but behind the list. Or add as a background but resize it. How can i do it?
Here is what happened:
He is what happens if i put the image as an imageView:
Yes this is very easy to achieve with relative layouts
<RelativeLayout ... >
<ImageView ...
android:layout_alignParentTop="true"
android:scaleType="centerCrop“ />
<ListView ...
android:layout_alignParentTop="true“ />
</RelativeLayout>
With a relative layout z-index is decided by the order you declare the tags, so stuff towards the bottom of the xml is in front of stuff from closer to the top, when they are in the same position.
Use a FrameLayout (Inside FrameLayout view written on top will appear on top and so on)
<FrameLayout
android:layout_height="match_parent"
android:layout_width="match_parent"
xmlns:android="http://schemas.android.com/apk/res/android">
<ListView
android:layout_width="match_parent"
android:layout_height="match_parent"
></ListView>
<ImageView
android:layout_width="your_width_in_dp"
android:layout_height="your_height_in_dp"
/>
</FrameLayout>
You can also place FrameLayout inside another layout.
I want to display two different activities in a single screen how can i do that in android?Please if anybody has idea share it.And I don't wanna use fragments.
I want to display a screen which contains some fields and below(at the bottom of the screen) I want another screen with some buttons.
Is this possible in android?
If so, How can i do this ?
You can't have two activities in one screen. You can have only one. So, ultimate solution is Fragments.
An activity is not directly a visual component, so I'm thinking that what you're really asking is how to have a single activity display different views.
There's nothing that says you can't rerun setContentView() with a different layout/view ID. But there's another non-fragments way of doing what your probably want.
You can define more than one full-size (match_parent) view in a layout. What you want to do is set the visibility for one of them to "visible" with android:visibility="visible" and all the others to "gone" with android:visibility="gone".
Then when you want to switch the displayed view, you'll run setVisibility(View.GONE) on the outgoing view and setVisibility(View.VISIBLE) on the incoming. It's important to use GONE and not INVISIBLE or the layouts won't render correctly.
Sample layout file:
<FrameLayout 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"
tools:context=".MainActivity" >
android:layout_width="match_parent"
android:layout_height="match_parent" >
<ImageView
android:id="#+id/img"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:visibility="visible" />
<SurfaceView
android:id="#+id/video"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:visibility="gone" />
<WebView
android:id="#+id/web"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:visibility="gone" />
</FrameLayout>
Sample Code to switch view:
video.setVisibility(View.VISIBLE);
img.setVisibility(View.GONE);
web.setVisibility(View.GONE);
That said, you probably want to learn how to use fragments since you can handle switching the view along with other state in a single unit of work (a transaction). But the above approach above does work for simple view changes.
I want to place 2 ImageViews, one above the other.
Here is an example with a square and a circle.
How can I do that? I know only in runtime what images to use, so I cannot specify them in an xml file.
Thank you in advance.
You can use FrameLayout to stack views on each other.
<FrameLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"
android:layout_width="fill_parent"
android:layout_height="fill_parent">
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/img_green" />
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/img_red"/>
</FrameLayout>
then you may set android:layout_margin="" to properly position the ImageViews.
Note that the last child of FrameLayout is the top most visible view
You should specify their location inside the layout programmatically, this is not exactly what you are asking for, but you will get an idea of what you have to do :
How to create a RelativeLayout programmatically with two buttons one on top of the other?
Since absolute layout is deprecated you probably have to play with margins.