Custom background with layer-list to show diagonal lines?

Question

I just want to create a custom background but I'm not getting how to do that with xml not with image.

Here is the xml:

<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="@layout/ui_shape"
tools:context="${relativePackage}.${activityClass}" >
</RelativeLayout>

and I want like this. Is it possible to create xml like the required image?

here is ui_shape

<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android"  
>
<item>
    <rotate
        android:fromDegrees="45">
        <shape
            android:shape="line" >
            <stroke android:color="@color/ui" android:width="1dp" />
            <solid
                android:color="@color/ui" />
        </shape>
    </rotate>
</item>

</layer-list>

and color

<color name="ui">#0095A0</color>

here is what i got

get

anybody any idea?

unclear what you are asking, unclear image that you have posted, explain your problem — Shayan Pourvatan, Sep 22 '14 at 05:45
you can't create this pattern with xml ( I think ). why you don't use this as image? — Shayan Pourvatan, Sep 22 '14 at 07:27

score 5 · Answer 1 · answered Jun 12 '16 at 00:39

I know I am late, but this is my solution if anyone gets here:

1) create a single small diagonal line in photoshop or any other program, it should look like this

* *

2) Create the following XML drawable in android studio where "@drawable/diagonal_line" is the previous mentioned image:

<?xml version="1.0" encoding="utf-8"?>
<bitmap  xmlns:android="http://schemas.android.com/apk/res/android"
    android:src="@drawable/diagonal_line"
    android:tileMode="repeat"
    android:dither="true"
    >
</bitmap>

what this bitmap drawable will do is take that single diagonal line and repeat it all over the selected view.

3) Now use that XML drawable as your view background, as an example, this is how I used it, where "@drawable/tiled_background" is the XML in step 2:

<View
        android:layout_width="match_parent"
        android:layout_height="45dp"
        android:background="@drawable/tiled_background"/>

and here is the result:

I hope this helps anyone. Happy Coding!

Why do some pixels look darker than others when using this method? — hellowill89, Sep 13 '17 at 22:24
@hellowill89 they don't! this image is taking from Android Studio preview, it adds a shadow over the phone that's why they seem darker but they aren't. — eyadMhanna, Dec 19 '17 at 11:02

score 1 · Answer 2 · edited May 23 '17 at 11:54

1

Use

android:background="@drawable/yourcustombackground"

Define your custom background inside drawable (something like below)

<shape android:shape="rectangle">
       <corners android:radius="10dp"/>
       <stroke android:width="1dp" android:color="#555555"/>
       <solid android:color="#111111"/>
</shape>

Update: To display image at background

android:background="@drawable/ic_image"

ic_image is the desired image

Or you can use gradient also

edited May 23 '17 at 11:54

Community

1
1

answered Sep 22 '14 at 05:47

Nabin

11,216
8
63
98

2

i don't want to use image at all @Nabin – Kumar Bankesh Sep 22 '14 at 05:51

score -3 · Answer 3 · answered Sep 22 '14 at 06:35

-3

No. it is not possible in android to set diagonal line .You have to use image for it for the diagonal lines

answered Sep 22 '14 at 06:35

Harsh Parikh

3,845
3
14
14

but what when i use layer-list? @Harsh Parikh – Kumar Bankesh Sep 22 '14 at 06:40
see my question again please! @Harsh Parikh – Kumar Bankesh Sep 22 '14 at 06:43
@HarshParikh It's possible of course, please see my answer – eyadMhanna Jun 12 '16 at 07:20

Custom background with layer-list to show diagonal lines?

3 Answers3

Linked