I would like to see an image on top of Camera SurfaceView\preview.
How do I do that? Any examples?
A great example can be found in ZXing library, Barcode Scanner application.
What they do is they use FrameLayout for SurfaceView and their custom ViewfinderView so that both SurfaceView and ViewfinderView are covering full screen:
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent">
<SurfaceView android:id="#+id/preview_view"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_centerInParent="true"/>
<com.google.zxing.client.android.ViewfinderView
android:id="#+id/viewfinder_view"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:background="#color/transparent"/>
</FrameLayout>
Note the fill_parent values in layout_height and layout_width for both views.
And then they draw custom things in ViewfinderView.onDraw() method, just on top of what is being displayed by camera preview.
If you don't want to draw anything, but just use predefined image, then use ImageView instead of ViewfinderView. You might consider calling setAlpha method to make your image transparent (if drawable wasn't already transparent by itself).
Here is a screenshot from Barcode Scanner:
Related
I am trying to use PhotoView and I would like the image to be shown like it is in Android's Wallpaper app.
So it seems that the images in the wallpaper app are scaled down or up to fill the of the screen, but the width is seemingly unchanged such that if you want to view the whole picture you either have to zoom or scroll left and/or right? Is this making use of the setDisplayMatrix method? If so how would that method call look? Here is a sample of my xml, but I am making use of Glide to set the image, if I need to drop Glide and just use the PhotoView widget directly I am will to do that too if that would produce the desired effect.
<com.github.chrisbanes.photoview.PhotoView xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:id="#+id/photoView"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:showIn="#layout/activity_wallpaper_viewer"/>
Threw the image into a HorizontalScrollView, changed the xml a bit to this
<com.github.chrisbanes.photoview.PhotoView
android:id="#+id/photoView" android:adjustViewBounds="true"
android:layout_width="wrap_content" android:layout_height="match_parent"/>
Simple... Embarrassing...
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.
I would like to draw an always centered image overlay in MapView in Android, like a targeting reticle
The way that I am going to approach it is to use the onTouchEvent of Overlay and the
MotionEvent.Move to move the location of the overlay around.
Is there a better way of doing this?
You should be able to accomplish this with a RelativeLayout that contains a MapView and an ImageView for your centered image. Here's some sample XML:
<RelativeLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent">
<com.google.android.maps.MapView android:id="#+id/google_maps"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:apiKey="#string/maps_key"/>
<ImageView android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerInParent="true"
android:src="#drawable/mapcenter"/>
</RelativeLayout>
This will center your image and cut down on any processing that would otherwise be needed to center/keep the image centered. There is of course other ways to do this with an OverlayItem, let me know if the XML approach doesn't work and I'll post an Overlay Example.
I'm developing an app that shows a camera preview on a SurfaceView but I only want to show the top half of the preview.
Is there a way of cropping/clipping the view or will I have to resort to obscuring the bottom half with something like an image,other view or drawing?
regards
Simon
I am currently using this method to do the cropping (basically using the clip child ability of an absolute layout to clip a surfaceview child)
<AbsoluteLayout android:clipChildren="true" android:layout_alignParentRight="true" android:layout_width="240dp" android:id="#+id/absoluteLayout1" android:layout_height="80dp">
<SurfaceView android:id="#+id/swSurfaceView" android:layout_width="240dp" android:layout_height="160dp" android:visibility="visible"></SurfaceView>
</AbsoluteLayout>
Overlaying the SurfaceView with another view is the easiest way to do it... however, it's quite ugly if you ask me.
Why don't just set the SurfaceView height manually? Make it take the 50% of the screen space and it will do what you want. You don't provide code so we'll have to do some guesses: let's suppose you have a LinearLayout, then inside it you put two views: your surface view and another kind of view. Then, you set their height to be 0dip, and their weight to be 1... that should do it.
I have surfaceView class that is modeled after this, I populated it with 6 bitmaps. Is there a way to wrap the surfaceView around the bitmaps, instead of it covering the entire screen.
I have try this in my xml file:
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="horizontal">
<com.android.customclasses.Panel
android:layout_height="wrap_content"
android:layout_width="wrap_content">
</com.android.customclasses.Panel>
</LinearLayout>
but this does not work. it just fill the parent.
Thanks.
I don't think that SurfaceView has a notion of "wrap_content" (other than perhaps interpreting it to mean "fill_parent"). You would have to override onMeasure in your custom class Panel and call setMeasuredDimension with the appropriate size.
If you think about this it makes sense: your bitmaps are not inside the SurfaceView in the view hierarchy. They are simply being drawn by graphics commands to a SurfaceView which has a predetermined size.