I have the following layout,
<?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">
<com.example.linux.camtest.CameraPreview
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:id="#+id/camera_surfaceView"
android:layout_alignParentLeft="true"
android:layout_alignParentStart="true"
android:layout_centerVertical="true"/>
<ImageView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:id="#+id/image"
android:layout_alignParentTop="true"
android:layout_alignParentLeft="true"
android:layout_alignParentStart="true"
android:adjustViewBounds="true"
/>
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="New Button"
android:id="#+id/takePictureButton"
android:layout_alignParentBottom="true"
android:layout_centerHorizontal="true"/>
</RelativeLayout>
after taking the picture I do image.setImageBitmap(bitmap), the problem is that the picture is being displayed in a small area while I already set the image to match_parent, and I tried fill_parent and that didn't work also.
What I need is to have the image view to be set to the same size of the surfaceview, so when I take the picture and load it to the imageview it will cover the surfaceview
remove
android:adjustViewBounds="true"
and add
android:scaleType="fitXY"
to your imageView
Related
When "btn_report_addImage1" is clicked, the app call camera function to take a picture. then, the button is gone and the inner relativeLayout is appeared to show the picture i took and to show remove button on the top-right side of the picture.
The problem is:
I set the size of the image view with 65dp for width and height.
But when the picture is shown on the imageView, the picture gets bigger than before.
<LinearLayout
android:layout_width="match_parent"
android:layout_height="65dp"
android:orientation="horizontal">
<RelativeLayout
android:layout_width="65dp"
android:layout_height="match_parent">
<Button
android:id="#+id/btn_report_addImage1"
android:layout_width="match_parent"
android:layout_height="match_parent"
/>
<RelativeLayout
android:id="#+id/layout_report_image1"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:visibility="gone" >
<ImageView
android:id="#+id/image_report_image1"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:scaleType="fitXY"/>
<Button
android:id="#+id/btn_report_removeImage1"
android:layout_width="35dp"
android:layout_height="25dp"
android:layout_alignParentRight="true"
android:text="-"
android:textSize="5dp"
/>
</RelativeLayout>
</RelativeLayout>
<RelativeLayout
android:layout_width="65dp"
android:layout_height="match_parent"
android:layout_marginLeft="5dp">
<Button
android:id="#+id/btn_report_addImage2"
android:layout_width="match_parent"
android:layout_height="match_parent" />
<RelativeLayout
android:id="#+id/layout_report_image2"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:visibility="gone">
<ImageView
android:id="#+id/image_report_image2"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:scaleType="fitXY"/>
<Button
android:id="#+id/btn_report_removeImage2"
android:layout_width="35dp"
android:layout_height="25dp"
android:layout_alignParentRight="true"/>
</RelativeLayout>
</RelativeLayout>
You have given the scaleType as fitXY. That's the reason. android:scaleType="fitXY"
Scaling Image to fit the view in both the Axis we call fitXY, in your case you have already defined the l*b of Image, So remove the ScaleType = fitXY:
<ImageView
android:id="#+id/image_report_image1"
android:layout_width="match_parent"
android:layout_height="match_parent" />
// scaleType removed
You can set ImageView scaleType 'centerCrop'.
<ImageView
android:id="#+id/image_report_image1"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:scaleType="centerCrop" />
try to add image pragmatically in src. so you can get image size proper and display proper.
I have two images(plus and multiply ones) show below.When 'plus' image clicked, 'multiply' image is starting translate animation from the same position of the 'plus' image and going to the end of screen shown in attached last image.My problem is that 'multiply' image is animating in front of the 'plus' image shown in the attached second image.I want to animate it behind the 'plus' image not in front.
My xml for the image layouts :
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent">
<LinearLayout
android:id="#+id/parent"
android:layout_width="match_parent"
android:layout_height="40dp"
android:layout_marginTop="100dp"
android:clipChildren="false"
android:clipToPadding="false">
<ImageView
android:id="#+id/plus"
android:layout_width="80dp"
android:layout_height="wrap_content"
android:clickable="true"
android:clipChildren="true"
android:clipToPadding="true"
android:scaleType="centerInside"
android:src="#drawable/plus" />
<ImageView
android:id="#+id/multiply"
android:layout_width="80dp"
android:layout_height="wrap_content"
android:adjustViewBounds="true"
android:clickable="true"
android:scaleType="centerInside" />
</LinearLayout>
</LinearLayout>
just use Relative layout and change a little bit ... like this
<RelativeLayout
android:id="#+id/parent"
android:layout_width="match_parent"
android:layout_height="40dp"
android:layout_marginTop="100dp"
android:clipChildren="false"
android:clipToPadding="false">
<ImageView
android:id="#+id/multiply"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:adjustViewBounds="true"
android:clickable="true"
android:src="#android:drawable/btn_star_big_on"
android:scaleType="centerInside" />
<ImageView
android:id="#+id/plus"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:clickable="true"
android:clipChildren="true"
android:clipToPadding="true"
android:scaleType="centerInside"
android:src="#android:drawable/btn_star_big_off" />
</RelativeLayout>
Change the xml layout sequence:
For RelativeLayout, the first view you wrote in xml will be drawn firstly.
So you need to write multiply imageview first then plus imageview.
If you want to change the z-order dynamically, you can use view.bringToFront() API.
See:
https://developer.android.com/reference/android/view/View.html#bringToFront()
or view.setZ(float) from Android 5.0 (API 21)
https://developer.android.com/reference/android/view/View.html#setZ(float)
I'm trying to create an activity that display an image that is obtained from an url. I want the width of the image to adapt the screen but the height of the image can be longer than the screen so that the image becomes scrollable (vertically).
First of all, I displayed the image from a drawable folder and it worked with the following code :
<ScrollView
android:layout_width="fill_parent"
android:id="#+id/scrollView1"
android:layout_height="wrap_content"
android:layout_alignParentTop="true"
android:layout_alignParentLeft="true"
android:layout_alignParentRight="true"
android:scrollbarAlwaysDrawVerticalTrack="true">
<LinearLayout
android:id="#+id/linearLayout1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:gravity="center_horizontal">
<ImageView
android:src="#drawable/programme"
android:layout_height="wrap_content"
android:id="#+id/imageView2"
android:layout_width="wrap_content"
android:scaleType="fitStart"></ImageView>
</LinearLayout>
</ScrollView>
I obtained what I wanted :
http://i.stack.imgur.com/imPkZ.png
But now I wanted the image to charge from an URL so I used the ion library :
Ion.with(imageView)
.load("http://...");
The image load but it is no longer scrollable and doesn't display as wanted.
http://i.gyazo.com/704324724364235bbe417d5447265c42.png
Do you have any solution?
Thanks
I found the solution by setting android:layout_width="match_parent" in ScrollView, ImageView and LinearLayout and setting android:adjustViewBounds="true" for ImageView like this :
<ScrollView
android:layout_width="match_parent"
android:id="#+id/scrollView1"
android:layout_height="wrap_content"
android:scrollbarAlwaysDrawVerticalTrack="true">
<LinearLayout
android:id="#+id/linearLayout1"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center_horizontal"
android:orientation="vertical">
<ImageView
android:id="#+id/imageView2"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:scaleType="fitStart"
android:adjustViewBounds="true"/>
</LinearLayout>
</ScrollView>
I have ImageView which needs to be shown in full height available. However at top i have created LinearLayout which contains Text and Image. I want it to display at top but also want to image to fit screen. I have linear layout at bottom and its working fine.
This is my code for LinearLayout which i want to show at top. I have hidden actionbar
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent" >
<LinearLayout
android:id="#+id/actionbar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="top"
android:background="#android:color/black"
android:gravity="top"
android:orientation="horizontal"
android:visibility="visible" >
<ImageView
android:id="#+id/backbutton"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="left"
android:paddingLeft="10dp"
android:src="#drawable/back_button" />
<TextView
android:id="#+id/titleofscreen"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:text="Testing"
android:textColor="#22c064"
android:textSize="18sp" />
</LinearLayout>
<ImageView
android:id="#+id/imageShown"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:adjustViewBounds="true"
android:scaleType="fitXY" />
</FrameLayout>
If i dont set imageView scale type to android:scaleType="fitXY" then it works but image doesnt fit screen.
I want to display image to fit between above bar which contains Text and below it has some icons. But if i make image scaletype ='fitXY' it doesnt display above text. Following is screenshot but i want image to occupy space
If you want the image to be below the actionbar you should not use the FrameLayout as a parent. You either should use vertical LinearLayout with weight or `RelativeLayout". Try following code:
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent">
<LinearLayout
android:id="#+id/actionbar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="top"
android:background="#android:color/black"
android:gravity="top"
android:orientation="horizontal"
android:visibility="visible" >
<ImageView
android:id="#+id/backbutton"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="left"
android:paddingLeft="10dp"
android:src="#drawable/back_button" />
<TextView
android:id="#+id/titleofscreen"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:text="Testing"
android:textColor="#22c064"
android:textSize="18sp" />
</LinearLayout>
<ImageView
android:id="#+id/imageShown"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_below="#+id/actionbar"
android:layout_alignParentBottom="true"
android:scaleType="fitCenter"
/>
</RelativeLayout>
Also I doubt that you use fitXY as android:scaleType, because it doesn't maintain the aspect ratio of the image - so your image will be deformed (stretched). In your case you should rather use fitCenter, but it depends on how exactly you want to scale your image - you can also play with centerInside or centerCrop.
How do I get my relative layout to display my image view like this:
Instead of this?:
I want my layout to display as much of the image as it can and crop the outsides of the image, like when you're setting desktop background image to "Fill" in windows:
My xml layout so far:
<?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" android:fitsSystemWindows="true" android:alwaysDrawnWithCache="false">
<ImageView
android:id="#+id/imageView1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_alignParentTop="true" android:src="#drawable/background_race_light"/>
<LinearLayout
android:id="#+id/linearLayout1"
style="#style/SessionResumeBar"
android:layout_width="match_parent"
android:layout_height="wrap_content" >
<TextView
android:id="#+id/home_resumeSessionBar_text"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="Medium Text"
android:textAppearance="?android:attr/textAppearanceMedium" />
<Button
android:id="#+id/home_resumeSessionBar_buttonResume"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Resume" />
</LinearLayout>
</RelativeLayout>
Add a scale type to your imageview. There are several types. The one you need is
android:scaleType="center"
This page will help explain all the different types.
Set the ImageView layout parameters to match_parent and set scale type to an appropriate scale type which fulfills your needs:
<ImageView
android:id="#+id/imageView1"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_alignParentLeft="true"
android:scaleType="centerCrop"
android:layout_alignParentTop="true" android:src="#drawable/background_race_light"/>
Set scalexy = true in ImageView