I converted the png file to SVG and got it from http://inloop.github.io/svg2android/ to find the vector path information.
I have been trying to support from api level 21 to get the right resolution for all screen sizes by using vector drawables. (My app`s minSdk is 21)
The problem is that the text is white and the background color is transparent, but I am trying to change it using the fillColor attribute or strokeColor, but somehow not working well.
how do I achieve this? I want text`s color is white and other background is transparent.
<?xml version="1.0" encoding="utf-8"?>
<vector xmlns:android="http://schemas.android.com/apk/res/android"
android:width="386.000000dp"
android:height="149.000000dp"
android:viewportWidth="386.000000"
android:viewportHeight="149.000000"
>
<group
android:translateY="149.000000"
android:scaleX="0.100000"
android:scaleY="-0.100000"
>
<path
android:strokeColor="#FFFFFF"
android:strokeWidth="3"
android:pathData="M0 745 l0 -745 1930 0 1930 0 0 432 0 432 -45 -72 c-85 -138 -151 -202 -209 -202 -65 0 -85 40 -87 175 -2 140 -18 161 -77 97 -46 -50 -153 -224 -155 -252 -1 -18 -7 -20 -37 -18 l-35 3 2 80 c2 44 5 91 9 105 5 24 5 23 -17 -5 -44 -60 -135 -147 -171 -166 -49 -25 -112 -25 -138 1 -29 29 -33 61 -17 138 l14 70 -60 -44 c-32 -24 -63 -44 -68 -44 -5 0 -6 -19 -3 -42 11 -86 -57 -158 -148 -158 -39 0 -54 5 -73 25 -14 13 -25 31 -25 39 0 24 48 74 100 103 l48 27 -31 57 -31 56 -54 -44 c-30 -25 -65 -50 -78 -55 -20 -10 -23 -16 -18 -52 10 -84 -58 -156 -148 -156 -39 0 -54 5 -73 25 -14 13 -25 31 -25 39 0 24 48 74 100 103 l49 27 -26 46 -26 46 -81 -81 c-99 -100 -170 -138 -266 -143 -55 -3 -70 0 -100 20 -96 65 -67 247 51 325 33 22 56 28 110 31 63 4 70 2 95 -23 22 -22 25 -32 21 -62 -11 -64 -79 -113 -184 -134 -70 -13 -79 -28 -44 -70 16 -20 28 -24 68 -23 67 1 142 43 229 129 59 59 72 78 78 114 7 48 52 101 84 101 27 0 55 -34 48 -58 -4 -10 -17 -29 -31 -42 l-24 -23 32 -58 c18 -32 34 -59 37 -59 3 0 36 23 73 51 55 40 73 61 92 104 35 79 83 106 119 66 21 -23 15 -49 -19 -81 l-25 -23 32 -56 c17 -31 33 -58 34 -60 2 -2 33 18 69 43 67 48 101 88 91 104 -7 11 60 26 74 17 15 -9 12 -70 -7 -163 -16 -75 -16 -83 -1 -98 21 -21 45 -13 106 35 64 51 160 179 158 211 -1 18 6 27 25 34 15 5 35 6 44 2 16 -6 17 -16 11 -99 l-7 -92 49 75 c65 101 114 142 166 138 62 -5 77 -33 83 -164 5 -106 14 -144 33 -144 20 0 78 62 130 139 47 69 58 80 78 76 l22 -5 0 310 0 310 -1930 0 -1930 0 0 -745z m499 358 c-30 -38 -44 -42 -145 -43 l-101 0 -12 -62 c-7 -35 -15 -74 -18 -87 l-6 -24 79 6 c44 3 88 9 97 13 23 8 21 -8 -4 -40 -19 -24 -26 -26 -99 -26 l-79 0 -12 -57 c-20 -98 -18 -115 16 -132 24 -12 42 -12 100 -3 38 6 80 14 93 18 13 4 22 2 22 -4 0 -6 -10 -22 -22 -36 -26 -29 -94 -46 -189 -46 -122 0 -138 23 -111 163 l19 98 -23 -5 c-12 -3 -30 -9 -40 -13 -17 -6 -16 -4 2 28 13 22 29 35 46 37 23 3 27 10 38 65 6 34 14 73 17 86 5 22 4 23 -28 16 -19 -4 -47 -14 -62 -22 -16 -8 -31 -12 -34 -10 -6 7 24 64 39 74 7 4 90 11 183 14 94 3 187 6 209 7 35 2 37 1 25 -15z m2587 -21 c-18 -34 -91 -92 -117 -92 -40 0 -31 56 10 65 15 3 47 19 71 35 24 16 46 28 48 26 2 -2 -3 -18 -12 -34z m-2037 -47 c25 3 57 9 70 12 23 6 24 5 17 -42 -4 -26 -10 -54 -13 -62 -4 -10 6 -8 36 8 51 26 129 23 162 -7 98 -87 40 -283 -101 -342 -22 -9 -57 -13 -101 -10 l-67 4 -17 -84 c-9 -46 -15 -98 -13 -115 3 -31 2 -32 -37 -32 -39 0 -40 1 -43 35 -2 20 11 100 28 179 16 79 30 147 30 150 0 3 -14 -11 -31 -32 -86 -104 -211 -116 -282 -26 l-24 31 -25 -44 c-14 -23 -31 -61 -39 -83 -7 -22 -17 -44 -21 -49 -11 -14 -48 24 -48 49 0 23 67 132 95 155 13 10 12 17 -4 48 -10 21 -27 63 -37 96 l-18 58 23 19 c34 27 61 25 61 -6 0 -31 39 -135 50 -135 15 0 61 67 75 107 10 30 19 39 40 41 63 8 50 -45 -35 -141 -28 -30 -50 -59 -50 -64 0 -5 10 -19 23 -30 60 -55 102 -53 172 9 60 53 100 113 109 163 4 22 9 48 12 58 4 14 -1 17 -35 17 -37 0 -71 19 -71 40 0 5 -3 15 -6 24 -5 13 0 13 32 5 20 -6 58 -8 83 -4z m769 -95 c2 -17 -6 -34 -22 -49 -25 -23 -27 -24 -45 -7 -18 16 -21 16 -50 1 -44 -22 -115 -116 -162 -212 -37 -76 -43 -83 -70 -83 -18 0 -32 6 -36 16 -3 8 4 65 17 126 12 61 22 132 23 157 1 25 6 49 12 53 17 13 65 9 71 -6 3 -8 -1 -50 -9 -93 -8 -43 -14 -79 -12 -81 1 -2 13 14 26 35 31 50 106 131 144 155 19 12 44 17 70 16 34 -3 40 -6 43 -28z" />
<path
android:strokeColor="#FFFFFF"
android:strokeWidth="1"
android:pathData="M1163 894 c-48 -24 -59 -42 -77 -134 -21 -112 -22 -109 20 -126 88 -37 184 44 184 156 0 52 -24 98 -56 110 -32 13 -33 13 -71 -6z" />
<path
android:strokeColor="#FFFFFF"
android:strokeWidth="1"
android:pathData="M1995 930 c-32 -13 -75 -65 -90 -106 -7 -22 -10 -40 -5 -42 22 -8 93 22 125 52 60 57 39 125 -30 96z" />
<path
android:strokeColor="#FFFFFF"
android:strokeWidth="1"
android:pathData="M2329 656 c-41 -28 -53 -48 -36 -65 28 -28 86 5 90 53 3 38 -11 41 -54 12z" />
<path
android:strokeColor="#FFFFFF"
android:strokeWidth="1"
android:pathData="M2639 656 c-41 -28 -53 -48 -36 -65 28 -28 86 5 90 53 3 38 -11 41 -54 12z" />
</group>
</vector>
Thanks in advance for any help!
Use this class
private class VectorDrawableUtils {
Drawable getDrawable(Context context, int drawableResId) {
return VectorDrawableCompat.create(context.getResources(), drawableResId, context.getTheme());
}
Drawable getDrawable(Context context, int drawableResId, int colorFilter) {
Drawable drawable = getDrawable(context, drawableResId);
drawable.setColorFilter(ContextCompat.getColor(context, colorFilter), PorterDuff.Mode.SRC_IN);
return drawable;
}
}
And call it like this
new VectorDrawableUtils().getDrawable(mContext,R.drawable.x,R.color.black);
It's possible to make it so, however, you have to manually change your vector.
Currently, first path contains all letters and rectangle background.
To make all letter white you can use should extract letter in separate path and set fillColor for it. And so on.
BTW, why don't you use custom font for the purpose of text drawing? I think it is much more flexible and better in terms of performance.
Change Fill color if you want to change inside color
If you want change stroke color then change it's color
I have a following vector drawable:
<?xml version="1.0" encoding="utf-8"?>
<vector xmlns:android="http://schemas.android.com/apk/res/android"
android:width="25dp"
android:height="25dp"
android:viewportWidth="25"
android:viewportHeight="25">
<path
android:fillColor="#FFFFFF"
android:fillType="evenOdd"
android:strokeWidth="1"
android:pathData="M12.5,25 C19.4035594,25 25,19.4035594 25,12.5 C25,5.59644063 19.4035594,0 12.5,0
C5.59644063,0 0,5.59644063 0,12.5 C0,19.4035594 5.59644063,25 12.5,25 Z M12.5,24
C18.8512746,24 24,18.8512746 24,12.5 C24,6.14872538 18.8512746,1 12.5,1
C6.14872538,1 1,6.14872538 1,12.5 C1,18.8512746 6.14872538,24 12.5,24 Z M16,6
C17.6568542,6 19,7.34226429 19,8.99878564 L19,16.0012144 C19,17.6573979
17.6534829,19 16,19 C14.3431458,19 13,17.6577357 13,16.0012144 L13,8.99878564
C13,7.34260206 14.3465171,6 16,6 Z M14,16.0012144 C14,17.1052262 14.8952058,18
16,18 C17.1026267,18 18,17.1036857 18,16.0012144 L18,8.99878564 C18,7.89477378
17.1047942,7 16,7 C14.8973733,7 14,7.89631432 14,8.99878564 L14,16.0012144 Z
M8.33473905,12.5 C8.14415114,12.3451212 7.57820716,11.8273213
7.57820716,11.8273213 C6.80306599,11.0695455 6,10.0347728 6,9 C6,7 7,6 9,6 C11,6
12,7 12,9 C12,10.0347728 11.196934,11.0695455 10.4217928,11.8273213
C10.4217928,11.8273213 9.85584886,12.3451212 9.66526095,12.5
C9.85584886,12.6548788 10.4217928,13.1726787 10.4217928,13.1726787
C11.196934,13.9304545 12,14.9652272 12,16 C12,18 11,19 9,19 C7,19 6,18 6,16
C6,14.9652272 6.80306599,13.9304545 7.57820716,13.1726787 C7.57820716,13.1726787
8.14415114,12.6548788 8.33473905,12.5 Z M9.03460423,12 C10.1996214,11.0532638
11,9.74316 11,9 C11,7.55228475 10.4477153,7 9,7 C7.55228475,7 7,7.55228475 7,9
C7,9.74316 7.86958707,11.0532638 9.03460423,12 L8.96539577,13
C7.80037862,13.9467362 7,15.25684 7,16 C7,17.4477153 7.55228475,18 9,18
C10.4477153,18 11,17.4477153 11,16 C11,15.25684 10.1304129,13.9467362
8.96539577,13 L9.03460423,12 Z" />
</vector>
On preview tab in Android Studio it looks like this (and this is what is needed):
but when I set it programmatically to ImageView as its source, with the code:
imageMenuItem.setImageResource(R.drawable.keno);
it looks like this:
The xml code for ImageView is simple:
<ImageView
android:id="#+id/image_menu_item"
style="#style/UpperItemsImageLeftMenu"
app:srcCompat="#drawable/leftmenu_keno"
android:layout_width="#dimen/upper_item_image_dim_left_menu"
android:layout_height="#dimen/upper_item_image_dim_left_menu"
/>
The dark grey is the background, set elsewhere. Does anyone know how I can fix this?
Ok, so here is the solution.
Source of the problem
Problem is with this fill-rule in xml: android:fillType="evenOdd". Android doesn't support this parameter until Nougat version, so we must somehow avoid it. As #LewisMcGeary pointed out, there is an excellent explanation on this topis on : Marc Allison's blog. More about this fill-rule can be found on this link as suggested by #Duopixel.
My solution
I solved this problem by changing the software. I used this online tool as suggested by before mentioned blog post with following settings:
and then I saved it to xml with following content:
<?xml version="1.0" encoding="utf-8"?>
<vector
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:auto="http://schemas.android.com/apk/res-auto" xmlns:tools="http://schemas.android.com/tools"
tools:ignore="NewApi"
android:viewportWidth="25"
auto:viewportWidth="25"
android:viewportHeight="25"
auto:viewportHeight="25"
android:width="25dp"
auto:width="25dp"
android:height="25dp"
auto:height="25dp">
<path
android:pathData="M12.5 25C19.40356 25 25 19.40356 25 12.5C25 5.596441 19.40356 0 12.5 0C5.596441 0 0 5.596441 0 12.5C0 19.40356 5.596441 25 12.5 25M16 6C17.65685 6 19 7.342264 19 8.998786L19 16. 00121C19 17.6574 17.65348 19 16 19C14.34315 19 13 17.65774 13 16.00121L13 8.998786C13 7.342602 14.34652 6 16 6M14 16.00121C14 17.10523 14.89521 18 16 18C17.10263 18 18 17.10369 18 16.00121L18 8. 998786C18 7.894774 17.10479 7 16 7C14.89737 7 14 7.896314 14 8.998786L14 16.00121M8.334739 12.5C8.144151 12.34512 7.578207 11.82732 7.578207 11.82732C6.803066 11.06955 6 10.03477 6 9C6 7 7 6 9 6C11 6 12 7 12 9C12 10.03477 11.19693 11.06955 10.42179 11.82732C10.42179 11.82732 9.855849 12.34512 9.665261 12.5C9.855849 12.65488 10.42179 13.17268 10.42179 13.17268C11.19693 13.93046 12 14.96523 12 16C12 18 11 19 9 19C7 19 6 18 6 16C6 14.96523 6.803066 13.93046 7.578207 13.17268C7.578207 13.17268 8.144151 12.65488 8.334739 12.5M9.034604 12C10.19962 11.05326 11 9.74316 11 9C11 7.552285 10.44771 7 9 7C7.552285 7 7 7.552285 7 9C7 9.74316 7.869587 11.05326 9.034604 12M8.965396 13C7.800378 13.94674 7 15.25684 7 16C7 17.44772 7.552285 18 9 18C10.44771 18 11 17.44772 11 16C11 15.25684 10.13041 13 .94674 8.965396 13M12.5 24C6.148726 24 1 18.85127 1 12.5C1 6.148726 6.148726 1 12.5 1C18.85127 1 24 6.148726 24 12.5C24 18.85127 18.85127 24 12.5 24"
auto:pathData="M12.5 25C19.40356 25 25 19.40356 25 12.5C25 5.596441 19.40356 0 12.5 0C5.596441 0 0 5.596441 0 12.5C0 19.40356 5.596441 25 12.5 25M16 6C17.65685 6 19 7.342264 19 8.998786L19 16. 00121C19 17.6574 17.65348 19 16 19C14.34315 19 13 17.65774 13 16.00121L13 8.998786C13 7.342602 14.34652 6 16 6M14 16.00121C14 17.10523 14.89521 18 16 18C17.10263 18 18 17.10369 18 16.00121L18 8. 998786C18 7.894774 17.10479 7 16 7C14.89737 7 14 7.896314 14 8.998786L14 16.00121M8.334739 12.5C8.144151 12.34512 7.578207 11.82732 7.578207 11.82732C6.803066 11.06955 6 10.03477 6 9C6 7 7 6 9 6C11 6 12 7 12 9C12 10.03477 11.19693 11.06955 10.42179 11.82732C10.42179 11.82732 9.855849 12.34512 9.665261 12.5C9.855849 12.65488 10.42179 13.17268 10.42179 13.17268C11.19693 13.93046 12 14.96523 12 16C12 18 11 19 9 19C7 19 6 18 6 16C6 14.96523 6.803066 13.93046 7.578207 13.17268C7.578207 13.17268 8.144151 12.65488 8.334739 12.5M9.034604 12C10.19962 11.05326 11 9.74316 11 9C11 7.552285 10.44771 7 9 7C7.552285 7 7 7.552285 7 9C7 9.74316 7.869587 11.05326 9.034604 12M8.965396 13C7.800378 13.94674 7 15.25684 7 16C7 17.44772 7.552285 18 9 18C10.44771 18 11 17.44772 11 16C11 15.25684 10.13041 13 .94674 8.965396 13M12.5 24C6.148726 24 1 18.85127 1 12.5C1 6.148726 6.148726 1 12.5 1C18.85127 1 24 6.148726 24 12.5C24 18.85127 18.85127 24 12.5 24"
android:fillColor="#ffffff"
auto:fillColor="#ffffff" />
</vector>
I manually removed all auto:xxx tags and ended up with
<?xml version="1.0" encoding="utf-8"?>
<vector
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
tools:ignore="NewApi"
android:viewportWidth="25"
android:viewportHeight="25"
android:width="25dp"
android:height="25dp"
>
<path
android:pathData="M12.5 25C19.40356 25 25 19.40356 25 12.5C25 5.596441 19.40356 0 12.5 0C5.596441 0 0 5.596441 0 12.5C0 19.40356 5.596441 25 12.5 25M16 6C17.65685 6 19 7.342264 19 8.998786L19 16.00121C19 17.6574 17.65348 19 16 19C14.34315 19 13 17.65774 13 16.00121L13 8.998786C13 7.342602 14.34652 6 16 6M14 16.00121C14 17.10523 14.89521 18 16 18C17.10263 18 18 17.10369 18 16.00121L18 8.998786C18 7.894774 17.10479 7 16 7C14.89737 7 14 7.896314 14 8.998786L14 16.00121M8.334739 12.5C8.144151 12.34512 7.578207 11.82732 7.578207 11.82732C6.803066 11.06955 6 10.03477 6 9C6 7 7 6 9 6C11 6 12 7 12 9C12 10.03477 11.19693 11.06955 10.42179 11.82732C10.42179 11.82732 9.855849 12.34512 9.665261 12.5C9.855849 12.65488 10.42179 13.17268 10.42179 13.17268C11.19693 13.93046 12 14.96523 12 16C12 18 11 19 9 19C7 19 6 18 6 16C6 14.96523 6.803066 13.93046 7.578207 13.17268C7.578207 13.17268 8.144151 12.65488 8.334739 12.5M9.034604 12C10.19962 11.05326 11 9.74316 11 9C11 7.552285 10.44771 7 9 7C7.552285 7 7 7.552285 7 9C7 9.74316 7.869587 11.05326 9.034604 12M8.965396 13C7.800378 13.94674 7 15.25684 7 16C7 17.44772 7.552285 18 9 18C10.44771 18 11 17.44772 11 16C11 15.25684 10.13041 13.94674 8.965396 13M12.5 24C6.148726 24 1 18.85127 1 12.5C1 6.148726 6.148726 1 12.5 1C18.85127 1 24 6.148726 24 12.5C24 18.85127 18.85127 24 12.5 24"
android:fillColor="#ffffff"
/>
</vector>
which is what I was looking for.
I have uses shape drawable to get rounded coreners but adding a semicircle in between seems tricky.
you can use vector asset studio to draw a custom shape and use it as background for your layout
https://developer.android.com/studio/write/vector-asset-studio.html
You can use Vector Drawable to achieve your end result. I used potrace to convert your image into svg format which is included at the bottom.
Use the Android Studio to create a vector drawable from this svg file.
<?xml version="1.0" standalone="no"?>
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 20010904//EN"
"http://www.w3.org/TR/2001/REC-SVG-20010904/DTD/svg10.dtd">
<svg version="1.0" xmlns="http://www.w3.org/2000/svg"
width="271.000000pt" height="263.000000pt" viewBox="0 0 271.000000 263.000000"
preserveAspectRatio="xMidYMid meet">
<metadata>
Created by potrace 1.13, written by Peter Selinger 2001-2015
</metadata>
<g transform="translate(0.000000,263.000000) scale(0.100000,-0.100000)"
fill="#000000" stroke="none">
<path d="M225 2546 c-40 -17 -84 -63 -101 -103 -12 -27 -14 -228 -14 -1140 0
-1093 0 -1107 20 -1149 12 -24 39 -54 62 -70 l41 -29 456 -3 c251 -2 471 0
489 3 23 4 32 11 32 25 0 11 7 20 15 20 8 0 19 16 25 39 14 54 79 124 142 152
74 33 191 33 265 0 61 -27 125 -92 142 -144 7 -21 17 -37 22 -37 5 0 9 -18 9
-40 0 -40 7 -49 25 -31 6 6 151 11 345 13 l335 3 36 24 c20 14 47 41 60 60
l24 35 3 1105 c1 608 0 1121 -3 1139 -8 42 -59 100 -110 123 -36 17 -73 19
-392 19 l-353 0 0 -35 c0 -24 -5 -35 -15 -35 -8 0 -24 -20 -36 -45 -25 -53
-74 -99 -138 -128 -36 -16 -66 -21 -136 -21 -79 -1 -97 3 -147 27 -90 44 -148
127 -148 211 l0 26 -462 0 c-361 -1 -470 -4 -493 -14z m920 -93 c13 -44 28
-67 70 -109 182 -177 521 -113 592 112 l17 54 335 0 c375 0 383 -1 428 -69
l23 -34 -2 -1113 -3 -1112 -25 -27 c-51 -55 -54 -55 -399 -55 l-319 0 -7 32
c-19 86 -84 160 -180 205 -52 24 -73 28 -150 28 -82 0 -97 -3 -157 -33 -84
-41 -143 -105 -164 -179 l-15 -53 -460 0 c-497 0 -487 -1 -539 55 l-25 27 -3
1111 c-2 1096 -2 1112 18 1145 11 18 34 41 52 52 32 19 52 20 465 20 l432 0
16 -57z"/>
</g>
</svg>
In java there is an optimal buffer size of 32 Kb which is based solely on the cpu architecture being used. On Android phones does the Dalvik VM dynamically know the proper cache of the cpu to get the largest buffer size independent of the many different phones out there? If so how would I figure that out at runtime?
Say I want to optimize a audio recording activity by making the buffer the largest it can be and also the fastest. I know you can get the minimal size for it but what about the optimal size?
Maybe it depends on what device you have or mind.
However, experimentally, 8K < buffer size < 32K does work well and there are significant performance improvements under 8K. Somewhat interesting is that some data with buffer > 64K showed poorer performance than data with under 64K buffer
(I've tested on several android devices and tried to read 20MB binary file with various buffer size.)
Here's exp result and you'd better to paste them to spreadsheet if you wanna convert data in pretty form. header means buffer size and units are millisecond
graph: http://fb.com/photo.php?fbid=468345876512381
128 256 512 1K 2K 4K 8K 16K 32K 64K 128K 256K 512K 1M 2M 4M 8M 16M
Galaxy S 4047 3060 269 155 100 65 64 52 51 45 47 50 49 43 44 46 45 58
Optimus LTE 1178 617 322 172 101 65 47 42 41 35 36 39 44 61 56 51 72 60
HTC EVO 3971 1884 941 480 251 141 95 69 56 50 48 55 50 49 48 48 48 47
Galaxy S2 750 383 210 123 74 50 41 37 35 34 34 37 39 44 46 44 45 44
Galaxy Nexus 2272 1216 659 341 187 108 70 52 41 38 38 45 44 54 56 66 68 58
Galaxy Note 1549 799 404 220 127 75 58 54 52 56 52 45 44 62 43 39 44 46
InputStream in = openFileInput(FILE_NAME);
startTime = System.currentTimeMillis();
while (in.read(buffer) > 0) {
readCount++;
}
elapsedTime = System.currentTimeMillis() - startTime;