Develop Reference

Image doesn't resized even if size is defined in XML (Android Studio)

I want to make button with image like this:
This button has image above its text and image is resized from 512x512.
When I searched google, there were some methods to achive this. But I thought putting Text and Image inside LinearLayout and register onClick doesn't look nice so I decided to use drawableTop instead.
<Button
android:id="#+id/btn_gps"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginStart="16dp"
android:layout_marginEnd="8dp"
android:drawableTop="#drawable/main_icon_gps"
android:padding="20dp"
android:text="#string/main_btn_gps"
android:visibility="visible"
app:layout_constraintBottom_toTopOf="#+id/guideline_h60"
app:layout_constraintEnd_toEndOf="#+id/guideline_v50"
app:layout_constraintHorizontal_bias="1.0"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="#+id/guideline_h40" />
Original image is 512x512 so I made another XML file(main_icon_gps) inside drawable directory.
<!-- #drawable/main_icon_gps -->
<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android" >
<item
android:drawable="#drawable/drawable_gps"
android:width="64dp"
android:height="64dp"
/>
</layer-list >
It looked nice when inspecting in Android Studio preview but when I launched the app in AVD, image resize doesn't work properly.
To sum up, I tried to set image size with android:width and android:height inside separate XML drawable file and it worked nicely in Android Studio preview. But Android doesn't respect width and height that I defined in XML drawable file. How to make Android respect the width and height that I've defined at XML?
I have to use same image as different size so resizing actual image or have multiple image don't seem to be best idea.
Nesting things inside LinearLayout isn't good idea to me but if I have to achive what I want to make, then I will use that method. Before that, I want to fix the problem that image doesn't get resized.

You can use MaterialButton and iconSize attribute.
or use VectorDrawable instead of png image, in this way you can set width and height in your xml file, like this:
<vector xmlns:android="http://schemas.android.com/apk/res/android"
android:width="40dp"
android:height="40dp"
android:viewportWidth="24.0"
android:viewportHeight="24.0">
<path
android:fillColor="#fff"
android:pathData="M10,20v-6h4v6h5v-8h3L12,3 2,12h3v8z" />
</vector>

Make Seekbar thumb easier to grab

So I have a SeekBar but the little circle thumb thing is kind of hard to grab. Is there a way to make the hitbox larger? I don't necessarily care if the graphic itself looks any different -- I just want it to be grabbable.

You can customize the seekbar, Answered by Andrew, by changing the size of the Thumb.
create layered-drawable with shape as placeholder thumb_image.xml
<layer-list xmlns:android="http://schemas.android.com/apk/res/android" >
<item>
<shape>
<size
android:height="40dp"
android:width="40dp" />
<solid android:color="#android:color/transparent" />
</shape>
</item>
<item android:drawable="#drawable/scrubber_control_normal_holo"/>
</layer-list>
The example shows the result below.
<SeekBar
android:id="#+id/seekBar1"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:thumb="#drawable/thumb_image" />
Another good example here of Thumb customization.

Check out this cool library for Seekbar DiscreteSeekBar
And can be added without much complexity by the following
<org.adw.library.widgets.discreteseekbar.DiscreteSeekBar
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:dsb_min="2"
app:dsb_max="15"
/>
Which has the following attributes as well.
dsb_progressColor: color/colorStateList for the progress bar and thumb drawable
dsb_trackColor: color/colorStateList for the track drawable
dsb_indicatorTextAppearance: TextAppearance for the bubble indicator
dsb_indicatorColor: color/colorStateList for the bubble shaped drawable
dsb_indicatorElevation: related to android:elevation. Will only be used on API level 21+
dsb_rippleColor: color/colorStateList for the ripple drawable seen when pressing the thumb. (Yes, it does a kind of "ripple" on API levels lower than 21 and a real RippleDrawable for 21+.
dsb_trackHeight: dimension for the height of the track drawable.
dsb_scrubberHeight: dimension for the height of the scrubber (selected area) drawable.
dsb_thumbSize: dimension for the size of the thumb drawable.
dsb_indicatorSeparation: dimension for the vertical distance from the thumb to the indicator.
Other SeekBar components in the library are these

You want an inset drawable resource. This answer to the question "Offset shape within a ShapeDrawable" https://stackoverflow.com/a/3674134/3175580 happens to be the same thing, you're asking. Like the other answer, you'll still need to copy the target drawable if it's private.
The advantage (or disadvantage) is that this shows you exactly how much you're increasing the size by, instead of the total size. Plus, I think it saves memory because using a Transparent shape will create a transparent bitmap of that size (?).

How to implement horizontal line with custom textview in android?

I want to implement two horizontal line side by side and a custom textview in between those lines (exactly like the pic shown below)
I wrote the following code to implement the horizontal line
<View
android:id="#+id/separator"
android:layout_width="fill_parent"
android:layout_height="3dip"
android:layout_alignParentTop="true"
android:layout_centerVertical="true"
android:background="#color/green" />
Plz help me to create that custom text showing "OR" in between those lines. what should be the design approach? shall i use an imageview ?

I would suggest creating it as an image resource, and using an imageview instead of a textview. It would make things much easier for you.
I would suggest creating a medium density and high density version of the image though and placing them in the appropriate folders in your res folder.
/res/drawable-mdpi (put medium density image here)
/res/drawable-hdpi (put high density image here)

Simply use following with TextView
drawable_or_bg.xml
<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:innerRadius="0dp"
android:shape="ring"
android:thicknessRatio="2"
android:useLevel="false" >
<solid android:color="#YOUR_COLOR" />
</shape>
set it as background to TextView
Don't use image approche As image required for every density it will increase size of APK by atleast some bytes

Android: Stretch bitmap to fill entire screen

I'm using a bitmap as a background for activity. The code of the custom background is:
<item>
<bitmap android:src="#drawable/fog"
android:layout_width="match_parent"
android:adjustViewBounds="true"
/>
</item>
However it sits in the middle and doesn't occupy the entire screen space.
How can I make it fill all the available space?
I tried setting width and height to fill_parent.
Thanks

try adding:
android:layout_width="match_parent"
android:layout_height="match_parent"

I agree with the #androidz post. To avoid distortion, you can use the setAdjustViewBounds function (see here).

android:scaleType="fitXY" is what i use to fill imageviews, i never had bitmap as item, theres cropping ones too

Android tiling a background image: using a Bitmap resizes the image?

I'd like to have a tiled background in a layout I've created, in the x-direction. I've followed some good instructions found online to tile correctly, but the source image is now stretched vertically a good bit. I think it has to do with the nature of bitmap filetypes.
Example picture:
The first image is the background image before tiling. The second image is after tiling. As you can see, the image is stretched vertically a good bit, and also appears a bit blurry due to the resizing.
I've tried placing the images in both the drawable-hdpi and drawable folder. I've tried placing the XML file in both folders. None of that seemed to matter.
Here is the code for the layout that generated those two images:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="vertical">
<ImageView
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_marginTop="10dip"
android:background="#drawable/bg" />
<ImageView
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_marginTop="10dip"
android:background="#drawable/bg_repeat" />
</LinearLayout>
"#drawable/bg" is the actual image itself, bg.png. "#drawable/bg_repeat" is the following bitmap XML file:
<?xml version="1.0" encoding="utf-8"?>
<bitmap
xmlns:android="http://schemas.android.com/apk/res/android"
android:src="#drawable/cdetail_bg_unclaimed_details"
android:antialias="false"
android:dither="false"
android:filter="false"
android:gravity="center|center_vertical"
android:tileMode="repeat" />
Is there an alternative to this for x-repeat tiling? Or is there some workaround that I haven't examined yet? I've changed all of the options for antialias, dither, filter, etc. Nothing seemed to change anything.
Thanks for the help!
EDIT: This appears to be a bug using the Graphical Layout tool. It looks OK on my phone.

This appears to be a bug using the Graphical Layout tool. It looks OK on my phone.

You can't repeat a bitmap background in one-direction using xml but Java code surely can do that.
BitmapDrawable bitmap = (BitmapDrawable) getResources().getDrawable(R.drawable.image);
bitmap.setTileModeX(TileMode.REPEAT);
So now if you set this "bitmap" to any view's background
For example: If we have a TextView "text" then
text.setBackgroundDrawable(bitmap) will set the background of this text-view
to "bitmap".
It will repeat in x-direction but will preserve its height in y-direction
Hope this helps.