ImageView not filling screen - android

I want my green picture file to fill my android application's screen, but it does not fill the screen no matter what I try and I don't know why. I tried applying the fitXY attribute, I tried setting the width and height of the imageview in java to values larger than the screen width/height and it still doesn't fill the screen. It appears to be stuck at some fixed dimension. The preview image in the xml perspective shows me this http://imgur.com/a/hEzFZ and the actual outcome is this http://imgur.com/a/qPGN2
I do not know what to try anymore. Can someone please recommend something? I have included the xml code below.
<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">
<FrameLayout
android:id="#+id/camera_view"
android:layout_width="match_parent"
android:layout_height="match_parent">
</FrameLayout>
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Capture"
android:id="#+id/capture"
android:layout_gravity="center_horizontal|bottom" />
<ImageButton
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/imgClose"
android:layout_gravity="right|top"
android:background="#android:drawable/ic_menu_close_clear_cancel"
android:padding="20dp"/>
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/redReference"
android:src="#drawable/red"
android:layout_gravity="center" />
<ImageView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:id="#+id/blueReference"
android:src="#drawable/blue"
android:layout_gravity="center" />
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/green"
android:src="#drawable/green"
android:layout_gravity="center" />
</FrameLayout>

Although it is not clear from this code what exactly is wrong, here are some things to check:
android:layout_width and android:layout_height should have the value match_parent.
Make sure that the size of the parent of the FrameLayout matches the size of the screen.
EDIT: This worked for me (I have removed some colours):
<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">
<FrameLayout
android:id="#+id/camera_view"
android:layout_width="match_parent"
android:layout_height="match_parent">
</FrameLayout>
<Button
android:id="#+id/capture"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_horizontal|bottom"
android:text="Capture" />
<ImageButton
android:id="#+id/imgClose"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="right|top"
android:background="#android:drawable/ic_menu_close_clear_cancel"
android:padding="20dp" />
<ImageView
android:id="#+id/redReference"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:scaleType="fitXY"
android:layout_gravity="center"
android:src="#drawable/green" />
</FrameLayout>
EDIT 2: if you want to display just a colour you don't need to put an image there. Just use the colour code. This way you can also remove the scaleType line.

Related

How to remove padding from circular progressbar?

I have a circular ProgressBar where I want to place an image inside as shown in the screenshot, the circular progress bar have a default padding I guess ,So I need to remove it so both will have the same dimensions :
enter image description here
here is the code for the layout :
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#drawable/dikritem"
android:orientation="vertical">
<ProgressBar
style="?android:progressBarStyleHorizontal"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_above="#id/buttons"
android:layout_centerInParent="true"
android:layout_margin="0dp"
android:paddingStart="#null"
android:paddingTop="#null"
android:paddingEnd="#null"
android:paddingBottom="#null"
android:progress="100"
android:progressDrawable="#drawable/circlebackg"
/>
<ProgressBar
style="?android:progressBarStyleHorizontal"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_above="#id/buttons"
android:layout_centerInParent="true"
android:paddingStart="#null"
android:paddingTop="#null"
android:paddingEnd="#null"
android:paddingBottom="#null"
android:progress="80"
android:progressDrawable="#drawable/circle"
/>
<de.hdodenhof.circleimageview.CircleImageView xmlns:app="http://schemas.android.com/apk/res-auto"
android:id="#+id/tasbih_circ_back"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_above="#id/buttons"
android:layout_centerInParent="true"
android:padding="35dp"
android:src="#drawable/adkarbackground"
app:civ_border_color="#color/border"
app:civ_border_width="0dp" />
<Button
android:id="#+id/tasbih_circ_button"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_above="#id/buttons"
android:layout_centerInParent="true"
android:background="#android:color/transparent"
android:padding="40dp"
android:text="1"
android:textSize="60sp"
android:textStyle="bold" />
<LinearLayout
android:id="#+id/buttons"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_above="#+id/adView">
<Button
android:id="#+id/tasbih_plus"
android:layout_width="80dp"
android:layout_height="60dp"
android:layout_margin="20dp"
android:background="#drawable/adkarbackground"
android:text="+"
android:textSize="40dp" />
<Button
android:layout_width="0dp"
android:layout_height="60dp"
android:layout_gravity="center"
android:layout_weight="1"
android:background="#drawable/adkarbackground"
android:text="0"
android:textSize="40sp"
/>
<Button
android:layout_width="80dp"
android:layout_height="60dp"
android:layout_margin="20dp"
android:background="#drawable/adkarbackground"
android:text="-"
android:textSize="40dp" />
</LinearLayout>
<com.google.android.gms.ads.AdView xmlns:ads="http://schemas.android.com/apk/res-auto"
android:id="#+id/adView"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
ads:adSize="SMART_BANNER"
ads:adUnitId="ca-app-pub-3940256099942544/6300978111">
</com.google.android.gms.ads.AdView>
</RelativeLayout>
is there any solution to remove the default padding ??
Using the current com.google.android.material.progressindicator.CircularProgressIndicator you can set app:indicatorInset="0dp" allowing you, for instance, to set a full circle as background which borders will match exactly with the progress indicator itself.
if you want to make your view little bigger than
Try Using Negative Padding like or try using scalex and scaley but use values greater than 1 in scale values. It will increase the scale of the view inside.
android:padding="-10dp"
android:scaleX="1.2"
try this in your progress bar code (xml file)
android:adjustViewBounds="true"
android:scaleType="fitXY"
view this link :
Android ImageButton crops on resize

how to adjust images in every where i want to layout in android?

I have an layout with a background that already made for host my app's image buttons. my image buttons are in a row of middle in this layout. my emulator is 480*800 px hdpi that dp is:320*533.
when i adjust buttons from xml, everything is OK. but when run, my buttons change smaller than from size of in xml and layout is not ordered. please help me. what can i do?
myt xml code for this layout is:
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#drawable/main">
<ScrollView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_above="#+id/bottom_panel"
>
</ScrollView>
<LinearLayout
android:id="#+id/bottom_panel"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal"
android:layout_alignParentBottom="true"
android:paddingBottom="75dp">
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/help_ic"
android:src="#drawable/help_main_hdpi"
android:layout_marginTop="0dp"
android:layout_gravity="right"
android:layout_weight="1"
/>
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/feed_ic"
android:src="#drawable/feed_main_hdpi"
android:layout_marginTop="0dp"
android:layout_gravity="right"
android:layout_weight="1"
/>
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/search_ic"
android:src="#drawable/search_main_hdpi"
android:layout_marginTop="0dp"
android:layout_gravity="right"
android:layout_weight="1"
/>
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/read_ic"
android:src="#drawable/read_main_hdpi"
android:layout_marginTop="0dp"
android:layout_gravity="right"
android:layout_weight="1"
android:paddingBottom="0dp" />
</LinearLayout>
As you have given weight to your ImageView,set
android:layout_width="0dp"
instead of "wrap_content" for the ImageView and give the total weightsum to the parent LinearLayout i.e 4 in your case.
Try this, I hope It will help you.

Why the height of the scroll view is longer than the actual content

<?xml version="1.0" encoding="utf-8"?>
<ScrollView xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="wrap_content" >
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content" >
<ImageView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:adjustViewBounds="true"
android:scaleType="fitStart"
android:src="#drawable/splash_bg" />
<ImageView
android:id="#+id/photo_area"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentTop="true"
android:layout_centerHorizontal="true"
android:layout_margin="20dp"
android:adjustViewBounds="true" />
<TextView
android:id="#+id/share_title"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#+id/photo_area"
android:layout_marginLeft="20dp"
android:text="#string/share_title"
android:textColor="#android:color/white" />
<EditText
android:id="#+id/share_content"
android:layout_width="match_parent"
android:layout_height="100dp"
android:layout_below="#+id/share_title"
android:layout_marginLeft="20dp"
android:layout_marginRight="20dp"
android:background="#drawable/custom_textarea"
android:gravity="top|left"
android:hint="default message" />
<ImageView
android:id="#+id/share_submit"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="#+id/share_content"
android:layout_marginLeft="20dp"
android:layout_marginRight="20dp"
android:src="#drawable/photo_taken_btn_submit" />
</RelativeLayout>
</ScrollView>
This is the xml of the layout. The photo_area by default do not have image set but it will download a picture from internet and set on it. The problem is the height of the content view is longer than it should be, so there is a lot of empty space at the end . I try to removed the background in linearlayout, the height reduced a bit but still there are some empty space how to fix it? Thanks
use android:adjustviewbound = "true" in the imageview xml fix the problem.

ImageView: scale properly above Button

I'm new to Android and everything went well until now I have to deal with the layout.
What I want is this layout:
Layout how it should be:
The image should be properly scaled and keep its ratio.
That's why I tried this XML code, but it doesn't work the way I want. The image keeps its ratio but the left and right side are out of the screen when vertical and cut at the top and bottom when horizontal:
Layout how it is:
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_centerHorizontal="true"
android:orientation="vertical"
android:background="#color/background">
<ImageView
android:layout_width="wrap_content"
android:layout_height="0dp"
android:layout_gravity="center"
android:src="#drawable/logo"
android:gravity="center"
android:scaleType="centerCrop"
android:contentDescription="#string/app_logo"
android:layout_weight="2.5" />
<LinearLayout
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="4"
android:gravity="center">
<Button
android:id="#+id/id1"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:layout_marginBottom="20dp"
android:layout_marginLeft="50dp"
android:layout_marginRight="50dp"
android:text="#string/text1"
android:textSize="40sp"
/>
<Button
android:id="#+id/id2"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:layout_marginLeft="50dp"
android:layout_marginRight="50dp"
android:text="#string/text2"
/>
<Button
android:id="#+id/id3"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginLeft="50dp"
android:layout_marginRight="50dp"
android:layout_gravity="center"
android:text="#string/text3" />
</LinearLayout>
</LinearLayout>
I googled a lot but just could not find what I was looking for.
Please help!
It looks like android:scaleType="fitCenter" is what you are looking for
you have to design 2 layout for you vertical state and horizontal state and put them in two different folder in your android project:
while you put your regular layout in the layout folder you should put the landscape layout in the layout-land folder.
Try setting android:scaleType="fitXY" to your ImageView.

Is there a way to offset a view from center?

I'm trying to possition my button not exactly in center, but let's say in the 2/5s of the screen height, I was looking for attribute unsuccessfully, so I tried this approach
<RelativeLayout 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"
android:background="#drawable/background"
android:padding="20dp" >
<ImageButton
android:id="#+id/flashlight_button"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
android:layout_above="#+id/fakeView"
android:background="#null"
android:contentDescription="#string/flashlight_button_description"
android:src="#drawable/freeml_bright" />
<View
android:id="#+id/fakeView"
android:layout_width="10dp"
android:layout_height="10dp"
android:layout_centerInParent="true"
android:background="#FFAABB" />
</RelativeLayout>
However it does not work, even if I set margin on the fake view.
Padding attribute works, however as it is a big image and if I want it to start at 2/5ths of screen height, it covers the center point of screen, so if I use padding attribute it works but it pushes it away from center and does not allow it to cover it.
Alhough, I made it work using LinearLayout, which I wanted to avoid because there are more Views on top and bottom next to each other so it would lead to nested views using linear layout. Unfortunately I think its the only option.
It basically it uses another linear layout that fills the remaining space left unused by top and bottom views with height=0dp and weight=1 and sets its gravity to center.
<?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"
android:orientation="vertical"
android:padding="20dp">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal"
android:gravity="center" >
<ImageView
android:id="#+id/imageView1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:contentDescription="#string/application_logo_description"
android:src="#drawable/mylight" />
<ImageButton
android:id="#+id/settings_button"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="right"
android:background="#null"
android:contentDescription="#string/settings_button_description"
android:src="#drawable/settings_button" />
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1"
android:gravity="center"
android:orientation="vertical" >
<ImageButton
android:id="#+id/flashlight_button"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#null"
android:contentDescription="#string/flashlight_button_description"
android:src="#drawable/flashlight_button_selector" />
<View
android:id="#+id/fakeView"
android:layout_width="0dp"
android:layout_height="0dp"
android:layout_marginTop="60dp"
android:background="#FFAABB" />
</LinearLayout>
<ImageView
android:id="#+id/imageView2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="bottom|center_horizontal"
android:contentDescription="#string/powered_by_description"
android:src="#drawable/powered_by" />
<ImageButton
android:id="#+id/ad_button"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="bottom|center_horizontal"
android:background="#null"
android:contentDescription="#string/ad_button_description"
android:src="#drawable/freeml" />
</LinearLayout>
Depending on the screen size of the target device, padding by X dp might move it more than just a fifth of the height.
You might have to code this movement yourself. However, nothing prevents you from doing:
<RelativeLayout 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"
android:background="#drawable/background"
android:padding="20dp" >
<View
android:id="#+id/fakeView"
android:layout_width="10dp"
android:layout_height="10dp"
android:layout_centerInParent="true"
android:background="#FFAABB" />
<ImageButton
android:id="#+id/flashlight_button"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
android:layout_above="#+id/fakeView"
android:marginBottom="50dp"
android:background="#null"
android:contentDescription="#string/flashlight_button_description"
android:src="#drawable/freeml_bright" />
</RelativeLayout>
Don't use margin, use padding (top), like so:
<View
android:id="#+id/fakeView"
android:layout_width="10dp"
android:layout_height="10dp"
android:layout_centerInParent="true"
android:paddingTop="80dp"
android:background="#FFAABB" />
That should work, though I've not tested it!
try using attribute android:layout_toLeftOf="#+id/fakeView"

Categories

Resources