Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

How do you render text in an android layer-list xml file?

Tags:

android

xml

I would like to add text to a layer-list xml file that is used as a drawable background for a Switch element. The problem is the text in the switch element changes before the background does so to sync these I thought I could just put the text into the background instead of setting android:textOn and android:textOff. Or if you know of another attribute besides android:state_checked that I can use that will change when the text in the Switch element does, I will accept that as an answer.

My current layer list, which contains an icon and a background color looks like this:

<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
    <item
        android:state_checked="true">
        <shape>
            <solid
            android:color="@color/btn_switch_electricity" />
            <corners
                android:radius="5dp" />
        </shape>
    </item> 
    <item android:right="10dp">
        <bitmap
            android:gravity="right"
            android:src="@drawable/ic_toggle_electricity" />
    </item>
</layer-list>

So to summarize, is it possible to render some text in this layer-list?

Thanks in advance for your helpful comments/answers.

like image 953
methodMan Avatar asked Apr 03 '14 22:04

methodMan


People also ask

How do I add text to Layerlist?

One way to add Texts in your drawable layer-list is by creating a png file of the text and adding it using bitmap.

What is use of layer list in android?

Layer list. A LayerDrawable is a drawable object that manages an array of other drawables. Each drawable in the list is drawn in the order of the list—the last drawable in the list is drawn on top.

What is stroke in android XML?

This is used to control the behavior of miter joins when the joins angle is sharp. This value must be >= 0.


1 Answers

With the new api21 you can use VectorDrawables to do something like you want. Here is an example:

<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:state_checked="true">
        <shape>
            <solid android:color="@android:color/white"/>
            <corners android:radius="5dp"/>
        </shape>
    </item>
    <item android:drawable="@drawable/vector"/>
</layer-list>

That will use a drawable vector like the following:

<?xml version="1.0" encoding="utf-8"?>
<vector xmlns:android="http://schemas.android.com/apk/res/android"
        android:height="32dp"
        android:width="32dp"
        android:viewportHeight="200"
        android:viewportWidth="200">
    <path android:name="text"
          android:fillColor="@android:color/black"
          android:pathData="M 28.53,92.12
           C 27.92,92.12 27.56,91.64 27.56,91.09
             27.56,90.52 27.92,90.00 28.50,90.00
             28.50,90.00 41.73,90.00 41.73,90.00
             42.31,90.00 42.67,90.52 42.67,91.09
             42.67,91.64 42.28,92.12 41.73,92.12
             41.73,92.12 36.31,92.12 36.31,92.12
             36.31,92.12 36.31,108.02 36.31,108.02
             36.31,108.67 35.78,109.00 35.12,109.00
             34.48,109.00 33.94,108.67 33.94,108.02
             33.94,108.02 33.94,92.12 33.94,92.12
             33.94,92.12 28.53,92.12 28.53,92.12 Z
           M 55.80,108.11
           C 55.80,108.72 55.28,109.00 54.66,109.00
             54.02,109.00 53.55,108.72 53.55,108.11
             53.55,108.11 53.55,100.94 53.55,100.94
             53.55,99.03 52.73,97.97 50.94,97.97
             49.59,97.97 48.56,98.56 47.77,99.55
             47.17,100.31 46.92,100.95 46.92,101.83
             46.92,101.83 46.92,108.11 46.92,108.11
             46.92,108.72 46.47,109.00 45.84,109.00
             45.17,109.00 44.69,108.72 44.69,108.11
             44.69,108.11 44.69,91.09 44.69,91.09
             44.69,90.38 45.17,90.00 45.84,90.00
             46.47,90.00 46.92,90.34 46.92,91.09
             46.92,91.09 46.92,97.77 46.92,97.77
             46.92,98.06 46.81,98.58 46.77,98.92
             46.77,98.92 46.70,98.89 46.70,98.89
             47.50,97.25 48.84,96.00 51.38,96.00
             54.22,96.00 55.80,97.73 55.80,100.52
             55.80,100.52 55.80,108.11 55.80,108.11 Z
           M 60.25,103.00
           C 60.30,105.59 61.72,107.20 64.31,107.20
             66.05,107.20 66.97,106.42 67.55,105.31
             67.55,105.31 67.55,105.34 67.55,105.34
             67.77,104.97 68.11,104.81 68.44,104.81
             68.61,104.81 68.78,104.86 68.94,104.89
             69.36,105.00 69.72,105.25 69.72,105.64
             69.72,105.77 69.69,105.89 69.64,105.95
             68.84,107.42 67.41,109.00 64.28,109.00
             60.36,109.00 58.03,106.34 58.03,102.67
             58.03,98.80 60.23,96.00 64.14,96.00
             67.66,96.00 69.66,98.64 69.89,101.50
             69.89,101.56 69.89,101.61 69.89,101.69
             69.89,102.55 69.41,103.00 68.66,103.00
             68.66,103.00 60.25,103.00 60.25,103.00 Z
           M 67.31,101.25
           C 67.58,101.25 67.64,101.17 67.64,100.97
             67.64,100.95 67.64,100.91 67.64,100.88
             67.34,99.33 66.36,97.77 64.14,97.77
             61.84,97.77 60.62,99.14 60.31,101.25
             60.31,101.25 67.31,101.25 67.31,101.25 Z
           M 82.88,108.17
           C 82.88,108.67 82.47,109.00 81.78,109.00
             81.11,109.00 80.66,108.72 80.66,107.83
             80.66,107.83 80.66,91.11 80.66,91.11
             80.66,90.38 81.11,90.00 81.78,90.00
             82.41,90.00 82.88,90.38 82.88,91.11
             82.88,91.11 82.88,96.98 82.88,96.98
             82.88,97.50 82.81,98.16 82.75,98.66
             82.75,98.66 82.69,98.66 82.69,98.66
             83.58,97.05 85.02,96.00 87.22,96.00
             90.83,96.00 92.92,98.58 92.92,102.44
             92.92,106.25 90.70,109.00 87.16,109.00
             84.94,109.00 83.47,107.92 82.70,106.33
             82.70,106.33 82.77,106.33 82.77,106.33
             82.81,106.66 82.88,107.09 82.88,107.41
             82.88,107.41 82.88,108.17 82.88,108.17 Z
           M 82.81,102.47
           C 82.81,105.16 84.34,107.11 86.86,107.11
             89.30,107.11 90.64,105.25 90.64,102.61
             90.64,99.70 89.34,97.88 86.94,97.88
             84.30,97.88 82.81,99.88 82.81,102.47 Z
           M 95.66,96.91
           C 95.66,96.31 96.11,96.00 96.78,96.00
             97.42,96.00 97.92,96.31 97.92,96.91
             97.92,96.91 97.92,108.09 97.92,108.09
             97.92,108.70 97.42,109.00 96.78,109.00
             96.11,109.00 95.66,108.70 95.66,108.09
             95.66,108.09 95.66,96.91 95.66,96.91 Z
           M 98.44,91.61
           C 98.44,92.55 97.69,93.25 96.80,93.25
             95.89,93.25 95.14,92.55 95.14,91.61
             95.14,90.70 95.89,90.00 96.80,90.00
             97.69,90.00 98.44,90.70 98.44,91.61 Z
           M 111.00,96.88
           C 111.00,96.38 111.38,96.00 112.06,96.00
             112.72,96.00 113.12,96.31 113.12,97.14
             113.12,97.14 113.12,107.69 113.12,107.69
             113.12,113.56 110.19,114.81 107.03,114.81
             104.44,114.81 102.75,113.94 101.84,112.75
             101.72,112.56 101.64,112.38 101.64,112.17
             101.64,111.83 101.81,111.48 102.11,111.25
             102.30,111.09 102.58,110.98 102.83,110.98
             103.09,110.98 103.36,111.09 103.55,111.33
             104.44,112.45 105.47,113.00 106.92,113.00
             109.92,113.00 110.97,111.31 111.00,107.56
             111.00,107.30 111.05,106.77 111.09,106.45
             111.09,106.45 111.16,106.48 111.16,106.48
             110.36,107.95 108.97,109.00 106.86,109.00
             103.45,109.00 101.03,106.42 101.03,102.64
             101.03,98.73 103.20,96.00 106.91,96.00
             109.09,96.00 110.50,97.20 111.17,98.69
             111.17,98.69 111.09,98.69 111.09,98.69
             111.06,98.44 111.00,98.02 111.00,97.77
             111.00,97.77 111.00,96.88 111.00,96.88 Z
           M 103.31,102.64
           C 103.31,105.52 104.91,107.25 107.14,107.25
             109.59,107.25 111.05,105.28 111.05,102.47
             111.05,99.78 109.61,97.83 107.17,97.83
             104.72,97.83 103.31,99.70 103.31,102.64 Z
           M 126.09,91.11
           C 126.09,90.38 126.58,90.00 127.19,90.00
             127.86,90.00 128.30,90.38 128.30,91.11
             128.30,91.11 128.30,108.11 128.30,108.11
             128.30,108.72 127.83,109.00 127.16,109.00
             126.47,109.00 126.09,108.66 126.09,107.91
             126.09,107.91 126.09,107.41 126.09,107.41
             126.09,107.14 126.14,106.64 126.17,106.34
             126.17,106.34 126.23,106.38 126.23,106.38
             125.42,107.97 124.02,109.00 121.78,109.00
             118.28,109.00 116.03,106.33 116.03,102.44
             116.03,98.64 118.25,96.00 121.81,96.00
             124.05,96.00 125.42,97.06 126.27,98.67
             126.27,98.67 126.19,98.67 126.19,98.67
             126.14,98.19 126.09,97.52 126.09,96.98
             126.09,96.98 126.09,91.11 126.09,91.11 Z
           M 118.31,102.45
           C 118.31,105.30 119.67,107.14 122.09,107.14
             124.61,107.14 126.14,105.16 126.14,102.64
             126.14,99.91 124.73,97.88 122.09,97.88
             119.67,97.88 118.31,99.77 118.31,102.45 Z
           M 143.42,102.47
           C 143.42,106.23 141.08,109.00 137.34,109.00
             133.38,109.00 131.03,106.31 131.03,102.47
             131.03,98.72 133.41,96.00 137.28,96.00
             141.12,96.00 143.42,98.70 143.42,102.47 Z
           M 133.31,102.53
           C 133.31,105.28 134.72,107.16 137.19,107.16
             139.81,107.16 141.14,105.33 141.14,102.44
             141.14,99.72 139.81,97.86 137.36,97.86
             134.77,97.86 133.31,99.66 133.31,102.53 Z
           M 155.00,96.88
           C 155.00,96.38 155.38,96.00 156.06,96.00
             156.72,96.00 157.12,96.31 157.12,97.14
             157.12,97.14 157.12,107.69 157.12,107.69
             157.12,113.56 154.19,114.81 151.03,114.81
             148.44,114.81 146.75,113.94 145.84,112.75
             145.72,112.56 145.64,112.38 145.64,112.17
             145.64,111.83 145.81,111.48 146.11,111.25
             146.30,111.09 146.58,110.98 146.83,110.98
             147.09,110.98 147.36,111.09 147.55,111.33
             148.44,112.45 149.47,113.00 150.92,113.00
             153.92,113.00 154.97,111.31 155.00,107.56
             155.00,107.30 155.05,106.77 155.09,106.45
             155.09,106.45 155.16,106.48 155.16,106.48
             154.36,107.95 152.97,109.00 150.86,109.00
             147.45,109.00 145.03,106.42 145.03,102.64
             145.03,98.73 147.20,96.00 150.91,96.00
             153.09,96.00 154.50,97.20 155.17,98.69
             155.17,98.69 155.09,98.69 155.09,98.69
             155.06,98.44 155.00,98.02 155.00,97.77
             155.00,97.77 155.00,96.88 155.00,96.88 Z
           M 147.31,102.64
           C 147.31,105.52 148.91,107.25 151.14,107.25
             153.59,107.25 155.05,105.28 155.05,102.47
             155.05,99.78 153.61,97.83 151.17,97.83
             148.72,97.83 147.31,99.70 147.31,102.64 Z
           M 161.23,91.11
           C 161.23,90.44 161.80,90.00 162.59,90.00
             163.36,90.00 163.92,90.44 163.91,91.11
             163.91,91.11 163.56,103.41 163.56,103.41
             163.55,103.97 163.05,104.23 162.56,104.23
             162.06,104.23 161.58,103.97 161.58,103.41
             161.58,103.41 161.23,91.11 161.23,91.11 Z
           M 164.27,107.36
           C 164.27,108.36 163.45,109.00 162.56,109.00
             161.62,109.00 160.88,108.36 160.88,107.36
             160.88,106.34 161.62,105.70 162.56,105.70
             163.45,105.70 164.27,106.34 164.27,107.36 Z"/>
</vector>

This will generate a list-layer drawable like the following:

list-layer drawable with vector drawable text.

Most image tools (gimp, photoshop, illustrator, etc.) give you the ability to export the path that can be used for the vector graphic.

Checkout the gist at github!

like image 175
Ray Hunter Avatar answered Sep 19 '22 16:09

Ray Hunter