[Guide] Make your own watch faces [23-1-2015] - Sony Smartwatch 2

Hello everyone, I've made a simplified tutorial to make your own watchface widget.
In this update I made simpler source code that simplified some steps.
Thanks to xda for posting it in xda Portal
Requirements:
-Eclipse
-Android SDK
-Sony Add-on SDK
Click to expand...
Click to collapse
-----------------------------------------------------------------------------------------------------------------------
-----------------------------------------------------------------------------------------------------------------------​
1-Download the samples.
2-Extract the zip.
3-Copy the both extracted folders to: "android-sdks\add-ons\addon-sony_add-on_sdk_3_0-sony-19\samples\SmartExtensions".
{
"lightbox_close": "Close",
"lightbox_next": "Next",
"lightbox_previous": "Previous",
"lightbox_error": "The requested content cannot be loaded. Please try again later.",
"lightbox_start_slideshow": "Start slideshow",
"lightbox_stop_slideshow": "Stop slideshow",
"lightbox_full_screen": "Full screen",
"lightbox_thumbnails": "Thumbnails",
"lightbox_download": "Download",
"lightbox_share": "Share",
"lightbox_zoom": "Zoom",
"lightbox_new_window": "New window",
"lightbox_toggle_sidebar": "Toggle sidebar"
}
4-Open Eclipse and press Ctrl+N, open "Android" and choose "Android Sample Project".
5-Choose "Sony Add-on SDK 3.0".
6-Choose "SmartExtensions > SmartExtensionAPI" and press Finish.
7-Repeat step 4 to 5, choose "SmartExtensions > SmartExtensionUtils" and press Finish.
8-Repeat step 4 to 5, choose "SmartExtensions > ClockWidgetAnalog" if you wanna make an analog clock. or "SmartExtensions > ClockWidgetDigitalList" if you need to make a digital clock. For example, I'll choose the analog clock.
9-Press Finish
10-Now your workspace should looks like this:
11-To rename the project right click on it like this image:
12-Give it any name you want
13-To rename application package right click like this image:
14-Go to: res/values/strings.xml
15-Change these strings and press Ctrl+S to save it.
-You can keep the 'more apps" link if you want. It go to the watch faces collection thread.
-It's optional to add your email, and here's how to remove "Contact me" button:
-Go to res/layout/activity_preference.xml and find this:
Code:
<Button
android:id="@+id/emailBtn"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:visibility="[COLOR="Red"]visible[/COLOR]"
android:text="@string/email_btn"/>
-Then change the text marked with red above to "gone". So it will be like this:
Code:
<Button
android:id="@+id/emailBtn"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:visibility="[COLOR="Red"]gone[/COLOR]"
android:text="@string/email_btn"/>
16-Change the graphical resources change files in res/drawable-nodpi
17-Connect you device to the pc
18-Enable USB debugging on your phone
19-Right click on the project > Run As > Android application
20-If you want to share the apk you'll find it in the project bin
21-Enjoy
-----------------------------------------------------------------------------------------------------------------------​
How To Resize:
1-Go to "AnalogClock.java" or "DigitalClockLevelList.java in src/-package name-.widgets
2-Edit the marked in red below:
Code:
@Override
public int getWidth() {
return getCellWidth() * [COLOR="Red"]5[/COLOR];
}
@Override
public int getHeight() {
return getCellHeight() * [COLOR="Red"]5[/COLOR];
}
-----------------------------------------------------------------------------------------------------------------------​
How To Add Date:
1-Create new xml file in "res/layout" and give it any name you want
2-Add this:
Code:
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:widgets="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:weightSum="1" >
[COLOR="RoyalBlue"]<com.sonyericsson.extras.liveware.aef.widget.TimeLayout[/COLOR]
android:layout_width="wrap_content"
android:layout_height="wrap_content" >
<com.sonyericsson.extras.liveware.aef.widget.TimeView
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:gravity="center"
android:includeFontPadding="false"
android:textColor="[COLOR="DarkOrange"]@android:color/white[/COLOR]"
widgets:textSize="[COLOR="Lime"]25[/COLOR]px"
widgets:timeType="[COLOR="Red"]days_of_month[/COLOR]" />
</com.sonyericsson.extras.liveware.aef.widget.TimeLayout>
</RelativeLayout>
3-You can change the text marked in red above to:
-"days_of_week"
-"days_of_month"
-"days_of_year"
-"months"
4-You can change the number marked in green above to any number you want, to set the font size. Please notice that the unit must be "px" and do not use "dp".
5-You can change on the text marked in orange "white" to "black", or you can remove all the text in orange and put any hex color code. For example:
android:textColor="#ffbf00"
6-To change the position of it, add under "<com.sonyericsson.extras.liveware.aef.widget.TimeLayout" which is marked in blue above:
-android:layout_centerInParent="true" to put it in the center.
-android:layout_centerHorizontal="true" to put it center in horizontal.
-android:layout_centerVertical="true" to put it center in vertical.
-android:layout_alignParentRight="true" to move it to right side.
-android:layout_alignParentLeft="true" to move it to left side.
-android:layout_alignParentTop="true" to move it to to the top.
-android:layout_alignParentBottom="true" to move it to the buttom.
-android:layout_marginRight="10px" change "10" to any number.
-android:layout_marginLeft="10px" change "10" to any number.
-android:layout_marginTop="10px" change "10" to any number.
-android:layout_marginBotton="10px" change "10" to any number.
7-At last, we must include the date xml on the main watch layout xml which is called on my samples "clock_widget_analog.xml" on analog and "clock_widget_levellists.xml" on the digital clock. For example, if you named the xml you made "date.xml" we will add the text marked in red below:
Code:
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:widgets="http://schemas.android.com/apk/res-auto"
xmlns:app="http://schemas.android.com/apk/res/com.sonymobile.smartconnect.extension.testclock"
android:layout_width="215px"
android:layout_height="170px"
android:background="@android:color/transparent"
android:baselineAligned="false" >
<ImageView
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:src="@drawable/watchface_bg" />
[COLOR="Red"]<include layout="@layout/date" />[/COLOR]
<include layout="@layout/analog_clock_hand_hours_border" />
<include layout="@layout/analog_clock_hand_minutes_border" />
<include layout="@layout/analog_clock_hand_seconds" />
</RelativeLayout>
-----------------------------------------------------------------------------------------------------------------------​
How To Reorder:
1-Open the main layout xml, -"clock_widget_analog.xml" on analog and "clock_widget_levellists.xml" on the digital clock-. For example, I'll work on analog.
2-You can remove text that start with "<!--" and end with "-->" like the marked in red . it's just notes from sony.This will make it easier:
Code:
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:widgets="http://schemas.android.com/apk/res-auto"
xmlns:app="http://schemas.android.com/apk/res/com.sonymobile.smartconnect.extension.testclock"
android:layout_width="215px"
android:layout_height="170px"
android:background="@android:color/transparent"
android:baselineAligned="false" >
<!-- We set a background on containing the base for a watch face. -->
<ImageView
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:src="@drawable/watchface_bg" />
[COLOR="Red"]<!-- Here we reference a TimeLayout using a single drawable for displaying
the hour hand. -->[/COLOR]
<include layout="@layout/analog_clock_hand_hours_border" />
[COLOR="Red"]<!-- Here we reference a TimeLayout using a single drawable for displaying
the minute hand. -->[/COLOR]
<include layout="@layout/analog_clock_hand_minutes_border" />
[COLOR="Red"]<!-- Here we reference a TimeLayout using a single drawable for displaying
the second hand. Note: Seconds will not be shown when the backlight is off
on the SmartWatch 2. -->[/COLOR]
<include layout="@layout/analog_clock_hand_seconds" />
</RelativeLayout>
3-Now you can reorder lines that start with "<include layout="
-----------------------------------------------------------------------------------------------------------------------​
Multiple WatchFace In One App:
-First example is to add digital clock to analog:
1-Copy xml and png files in res/layout and res/drawable-nodpi from digital to analog
2-Copy "DigitalClockLevelList.java" on src/-package name-.widgets from digital to analog
3-Open "ClockWidgetRegistrationInformation" in src/-package name-/ and search for: WidgetClassList widgetList = new WidgetClassList();
4-Add this under WidgetClassList widgetList = new WidgetClassList();:
widgetList.add(DigitalClockLevelList.class);
The text marked in red is same file name you've copied in step 2
5-Now Eclipse will underline it in red as error, it will give you a list of fixes, choose first fix
-Second example if you want to make 2 or more analog watchfaces:
1-Go to res/layout and duplicate all except "activity_preferences.xml", you can rename the duplicated xmls for example by adding "2"
2-Duplicate "AnalogClock.java" in src/-package name-.widgets
3-Add graphical resources on res/drawable-nodpi/ and give it the same names but with "_2"
4-Add the following lines to res/values/strings.xml:
Code:
<string name="name_1">Analog 1</string>
<string name="name_2">Analog 2</string>
To be like this:
Code:
<?xml version="1.0" encoding="utf-8"?>
<!-- No translation of sample extensions -->
<resources xmlns:tools="http://schemas.android.com/tools" tools:ignore="MissingTranslation">
<string name="app_name">Analog clock widget</string>
<string name="preference_info">Analog clock watchface widget for Sony SmartWatch2\nDeveloped by Naheel Azawy\nVersion 1.0</string>
[COLOR="Red"]<string name="name_1">Analog 1</string>
<string name="name_2">Analog 2</string>[/COLOR]
</resources>
5-Edit "AnalogClock2.java" in src/-package name-.widgets from:
Code:
package com.naheel.sw2.widget.example.analog.widgets;
import com.naheel.sw2.widget.example.analog.R;
/**
* This widget displays an analog clock providing resources which will be
* automatically rotated by the accessory firmware to reflect the time.
*/
public class AnalogClock2 extends SmartWatch2ClockWidget {
public AnalogClock2(WidgetBundle widgetBundle) {
super(widgetBundle);
}
@Override
int getWidgetLayout() {
return R.layout.[COLOR="Red"]clock_widget_analog[/COLOR];
}
@Override
public int getName() {
return R.string.[COLOR="Red"]app_name[/COLOR];
}
@Override
public int getWidth() {
return getCellWidth() * 5;
}
@Override
public int getHeight() {
return getCellHeight() * 5;
}
@Override
public int getPreviewUri() {
return R.drawable.[COLOR="Red"]watchface_analog_preview[/COLOR];
}
}
To:
Code:
package com.naheel.sw2.widget.example.analog.widgets;
import com.naheel.sw2.widget.example.analog.R;
/**
* This widget displays an analog clock providing resources which will be
* automatically rotated by the accessory firmware to reflect the time.
*/
public class AnalogClock2 extends SmartWatch2ClockWidget {
public AnalogClock2(WidgetBundle widgetBundle) {
super(widgetBundle);
}
@Override
int getWidgetLayout() {
return R.layout.[COLOR="Red"]clock_widget_analog_2[/COLOR];
}
@Override
public int getName() {
return R.string.[COLOR="Red"]name_2[/COLOR];
}
@Override
public int getWidth() {
return getCellWidth() * 5;
}
@Override
public int getHeight() {
return getCellHeight() * 5;
}
@Override
public int getPreviewUri() {
return R.drawable.[COLOR="Red"]watchface_analog_preview_2[/COLOR];
}
}
6-Edit "clock_widget_analog_2.xml" on res/layout from:
Code:
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:widgets="http://schemas.android.com/apk/res-auto"
xmlns:app="http://schemas.android.com/apk/res/com.sonymobile.smartconnect.extension.testclock"
android:layout_width="215px"
android:layout_height="170px"
android:background="@android:color/transparent"
android:baselineAligned="false" >
<!-- We set a background on containing the base for a watch face. -->
<ImageView
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:src="@drawable/[COLOR="Red"]watchface_bg[/COLOR]" />
<!-- Here we reference a TimeLayout using a single drawable for displaying
the hour hand. -->
<include layout="@layout/[COLOR="Red"]analog_clock_hand_hours_border[/COLOR]" />
<!-- Here we reference a TimeLayout using a single drawable for displaying
the minute hand. -->
<include layout="@layout/[COLOR="Red"]analog_clock_hand_minutes_border[/COLOR]" />
<!-- Here we reference a TimeLayout using a single drawable for displaying
the second hand. Note: Seconds will not be shown when the backlight is off
on the SmartWatch 2. -->
<include layout="@layout/[COLOR="Red"]analog_clock_hand_seconds[/COLOR]" />
</RelativeLayout>
To:
Code:
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:widgets="http://schemas.android.com/apk/res-auto"
xmlns:app="http://schemas.android.com/apk/res/com.sonymobile.smartconnect.extension.testclock"
android:layout_width="215px"
android:layout_height="170px"
android:background="@android:color/transparent"
android:baselineAligned="false" >
<!-- We set a background on containing the base for a watch face. -->
<ImageView
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:src="@drawable/[COLOR="Red"]watchface_bg_2[/COLOR]" />
<!-- Here we reference a TimeLayout using a single drawable for displaying
the hour hand. -->
<include layout="@layout/[COLOR="Red"]analog_clock_hand_hours_border_2[/COLOR]" />
<!-- Here we reference a TimeLayout using a single drawable for displaying
the minute hand. -->
<include layout="@layout/[COLOR="Red"]analog_clock_hand_minutes_border_2[/COLOR]" />
<!-- Here we reference a TimeLayout using a single drawable for displaying
the second hand. Note: Seconds will not be shown when the backlight is off
on the SmartWatch 2. -->
<include layout="@layout/[COLOR="Red"]analog_clock_hand_seconds_2[/COLOR]" />
</RelativeLayout>
7-Edit "analog_clock_hand_seconds_2.xml" from:
Code:
<?xml version="1.0" encoding="utf-8"?>
<!-- Use TimeLayout components to place TimeViews showing e.g. hours or minutes
when building up the UI. -->
<com.sonyericsson.extras.liveware.aef.widget.TimeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:widgets="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="@android:color/transparent"
widgets:gravity="center" >
<!-- Defines a second hand using a drawable and setting the timeType to
seconds. The second hand will be automatically rotated by the accessory
firmware. Note: Seconds will not be shown when the backlight is off
on the SmartWatch 2. -->
<com.sonyericsson.extras.liveware.aef.widget.TimeView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="@drawable/[COLOR="Red"]second_00[/COLOR]"
widgets:timeType="seconds" />
</com.sonyericsson.extras.liveware.aef.widget.TimeLayout>
To:
Code:
<?xml version="1.0" encoding="utf-8"?>
<!-- Use TimeLayout components to place TimeViews showing e.g. hours or minutes
when building up the UI. -->
<com.sonyericsson.extras.liveware.aef.widget.TimeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:widgets="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="@android:color/transparent"
widgets:gravity="center" >
<!-- Defines a second hand using a drawable and setting the timeType to
seconds. The second hand will be automatically rotated by the accessory
firmware. Note: Seconds will not be shown when the backlight is off
on the SmartWatch 2. -->
<com.sonyericsson.extras.liveware.aef.widget.TimeView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="@drawable/[COLOR="Red"]second_00_2[/COLOR]"
widgets:timeType="seconds" />
</com.sonyericsson.extras.liveware.aef.widget.TimeLayout>
8-Edit "analog_clock_hand_minutes_border_2.xml" from:
Code:
<?xml version="1.0" encoding="utf-8"?>
<!-- Use TimeLayout components to place TimeViews showing e.g. hours or minutes
when building up the UI. -->
<com.sonyericsson.extras.liveware.aef.widget.TimeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:widgets="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="@android:color/transparent"
widgets:gravity="center" >
<!-- Defines a minute hand using a drawable and setting the timeType to
minutes. The minute hand will be automatically rotated by the accessory
firmware. -->
<com.sonyericsson.extras.liveware.aef.widget.TimeView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="@drawable/[COLOR="Red"]minute_border_00[/COLOR]"
widgets:timeType="minutes" />
</com.sonyericsson.extras.liveware.aef.widget.TimeLayout>
To:
Code:
<?xml version="1.0" encoding="utf-8"?>
<!-- Use TimeLayout components to place TimeViews showing e.g. hours or minutes
when building up the UI. -->
<com.sonyericsson.extras.liveware.aef.widget.TimeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:widgets="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="@android:color/transparent"
widgets:gravity="center" >
<!-- Defines a minute hand using a drawable and setting the timeType to
minutes. The minute hand will be automatically rotated by the accessory
firmware. -->
<com.sonyericsson.extras.liveware.aef.widget.TimeView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="@drawable/[COLOR="Red"]minute_border_00_2[/COLOR]"
widgets:timeType="minutes" />
</com.sonyericsson.extras.liveware.aef.widget.TimeLayout>
9-Edit "analog_clock_hand_hours_border_2.xml" from:
Code:
<?xml version="1.0" encoding="utf-8"?>
<!-- Use TimeLayout components to place TimeViews showing e.g. hours or minutes
when building up the UI. -->
<com.sonyericsson.extras.liveware.aef.widget.TimeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:widgets="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="@android:color/transparent"
widgets:gravity="center" >
<!-- Defines an hour hand using a drawable and setting the timeType to
hours_fine. The hour hand will be automatically rotated by the accessory
firmware. -->
<com.sonyericsson.extras.liveware.aef.widget.TimeView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="@drawable/[COLOR="Red"]hour_border_00[/COLOR]"
widgets:timeType="hours_fine" />
</com.sonyericsson.extras.liveware.aef.widget.TimeLayout>
To:
Code:
<?xml version="1.0" encoding="utf-8"?>
<!-- Use TimeLayout components to place TimeViews showing e.g. hours or minutes
when building up the UI. -->
<com.sonyericsson.extras.liveware.aef.widget.TimeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:widgets="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="@android:color/transparent"
widgets:gravity="center" >
<!-- Defines an hour hand using a drawable and setting the timeType to
hours_fine. The hour hand will be automatically rotated by the accessory
firmware. -->
<com.sonyericsson.extras.liveware.aef.widget.TimeView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="@drawable/[COLOR="Red"]hour_border_00_2[/COLOR]"
widgets:timeType="hours_fine" />
</com.sonyericsson.extras.liveware.aef.widget.TimeLayout>
-----------------------------------------------------------------------------------------------------------------------
---Old thread---
-----------------------------------------------------------------------------------------------------------------------
Please do not take everything and say it's you'r own job. It's enough to say thanks to me on your app. There's something in this world called google removal
Click to expand...
Click to collapse
If you made a watch, post it here and I'll add it to the collection​

Hello,
Thank you very much for your Tutorial. I got my own analog clock.
But is there any way to have a background for Digital Clock?

8-Edit "analog_clock_hand_minutes_border_2.xml" from
dont have analog_clock_hand_minutes_border_2.xml !
---------- Post added at 02:53 PM ---------- Previous post was at 02:47 PM ----------
my watch faces

Hi,
Is it still possible to create new watch faces for the SW2 these days? The main obstacle to start seems to be the inability to download the Sony Add-on SDK. I have only been able to find version 1.0 so far with much searching. Does anyone know where the version 3 file can be downloaded?
Thanks,
Lee

Related

HTML 5 Video on Android 4.2.2 device (Geniatech ATV1220)

Hello I am trying to build a simple webview.
But I can't get the video to work. It is working when I am using an emulated device with 4.2.2 running but on the actual device (Geniatech ATV1220) I just get a grey videobox and I can't play video at all. It is loading for a second but then it stops.
Here is my Main activity:
Code:
public class MainActivity extends Activity {
public static final String PAGE_URL = "video js website"; //is correct in code - just can't post links
final Activity activity = this;
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
WebView webview = (WebView) findViewById(R.id.webView);
webview.getSettings().setJavaScriptEnabled(true);
webview.getSettings().setUseWideViewPort(true);
webview.getSettings().setLoadWithOverviewMode(true);
webview.setWebViewClient(new WebViewClient(){});
webview.setWebChromeClient(new WebChromeClient(){
public void onProgressChanged(WebView view, int progress){
activity.setTitle("Loading...");
if(progress == 100){
activity.setTitle(R.string.app_name);
}
}
});
webview.loadUrl(PAGE_URL);
}
}
My Manifest where I enable hardware acceleration:
Code:
<?xml version="1.0" encoding="utf-8"?>
<manifest xmlns:android="schemas.android.com/apk/res/android" //+http , just cant post links
package="com.example.androidwebview"
android:versionCode="1"
android:versionName="1.0" >
<uses-sdk
android:minSdkVersion="17"
android:targetSdkVersion="17" />
<uses-permission android:name="android.permission.INTERNET" />
<application
android:allowBackup="true"
android:hardwareAccelerated="true"
android:icon="@drawable/ic_launcher"
android:label="@string/app_name"
android:theme="@android:style/Theme.NoTitleBar.Fullscreen" >
<activity
android:name="com.example.androidwebview.MainActivity"
android:label="@string/app_name" >
<intent-filter>
<action android:name="android.intent.action.MAIN" />
<category android:name="android.intent.category.LAUNCHER" />
</intent-filter>
</activity>
</application>
</manifest>
On my virtual device it is running alright. I am using a 4.2.2 device for that too.
But if I install the apk on the box it just opens the website and i see a gray video frame with a play button, that doesn't work. Also the controls are shown and if i fast forward a bit there is this circle loading thing but it doesn't load anything.
Can anyone help me get video to run on this device in my webview?

[DEV]How to replace navbar icons on stock ROMs [SOLVED!]

I start this thread in order to share with you the information I already collected regarding the theming the navbar keys on stock roms. You should have realized that after Lollipop upgrade there is not even one stock based ROM or theme which contains themed navbar icons. The reason for this is:
1. Apktool RC3 is buggy on LG system apps, including LGSystemUI.apk. There is no way recently to decompile systemui and have access to the source code of the navbars.
2. With the Lollipop upgrade LG changed its approach regarding definition of the navbar icons using Google's new public classes of VectorDrawables.
Code:
java.lang.Object
↳android.graphics.drawable.Drawable
↳android.graphics.drawable.VectorDrawable
VectorDrawables are specific xml files that define vector graphics via vector coordinates.
The three main navbar icons are defined in LGSystemUI.apk as follows:
ic_sysbar_back_button.xml:
Code:
<?xml version="1.0" encoding="utf-8"?>
<vector android:height="42.0dip" android:width="42.0dip" android:viewportWidth="168.0" android:viewportHeight="168.0"
xmlns:android="http://schemas.android.com/apk/res/android">
<path android:fillColor="#ffffffff" android:pathData="M124.125,120.827h-76c-1.358,0-2.667-1.789-2.667-4c0-2.209,1.273-4,2.667-4h76c11.045,0,20-8.953,20-20 c0-11.046-8.955-19.999-20-19.999h-96v-8h96c15.463,0,28,12.535,28,27.999C152.125,108.292,139.588,120.827,124.125,120.827z" />
<path android:fillColor="#ffffffff" android:pathData="M45.447,54.302L30.36,66.189c0,0-1.581,1.291-0.553,2.639c-1.028,1.346,0.553,2.639,0.553,2.639 l15.086,11.886c0,0,3.054,2.04,0,5.447c-2.114,2.359-4.366,1.172-5.865,0L17.741,71.466c-1.291-1.074-1.616-2.639-1.616-2.639 s0.326-1.564,1.616-2.639l21.842-17.334c1.499-1.172,3.75-2.359,5.865,0C48.5,52.263,45.447,54.302,45.447,54.302z" />
</vector>
ic_sysbar_home_button.xml:
Code:
<?xml version="1.0" encoding="utf-8"?>
<vector android:height="48.0dip" android:width="48.0dip" android:viewportWidth="168.0" android:viewportHeight="168.0"
xmlns:android="http://schemas.android.com/apk/res/android">
<path android:fillColor="#ffffffff" android:pathData="M159.881,87.102l-0.541,1.217c-0.898,2.02-3.264,2.927-5.281,2.027L144.5,86.09c0,14.906,0,28.396,0,28.396 c0,2.209-1.791,4-4,4h-112c-2.209,0-4-1.791-4-4V86.09l-9.559,4.256c-2.018,0.898-4.382-0.009-5.281-2.027l-0.542-1.217 c-0.898-2.02,0.009-4.384,2.027-5.282l70.647-31.455c0.889-0.395,1.839-0.423,2.708-0.178c0.868-0.245,1.818-0.217,2.708,0.178 l70.647,31.455C159.873,82.718,160.781,85.082,159.881,87.102z M32.5,109.154c0,1.27,0.038,1.332,1.333,1.332h101.333 c1.244,0,1.334-0.047,1.334-1.332V82.528l-52-23.152l-52,23.152C32.5,95.766,32.5,109.154,32.5,109.154z" />
</vector>
ic_sysbar_recent_button.xml:
Code:
<?xml version="1.0" encoding="utf-8"?>
<vector android:height="42.0dip" android:width="42.0dip" android:viewportWidth="168.0" android:viewportHeight="168.0"
xmlns:android="http://schemas.android.com/apk/res/android">
<path android:fillColor="#ffffffff" android:pathData="M149,51.5H37c-2.209,0-5,1.027-5,3.236c0,0,0,5.764,0,10.764H21c-2.209,0-5,1.027-5,3.236v42.998 c0,2.211,2.791,4.766,5,4.766h112c2.209,0,3-2.555,3-4.766V101.5c8,0,13,0,13,0c2.209,0,3-2.555,3-4.766V54.736 C152,52.527,151.209,51.5,149,51.5z M128,106.402c0,1.285,0.91,2.098-0.333,2.098H26.333c-1.296,0-2.333-0.828-2.333-2.098V74.068 c0-1.27,1.038-0.568,2.333-0.568h101.333c1.243,0,0.333-0.716,0.333,0.568L128,106.402L128,106.402z M144,91.402 c0,1.285,0.91,2.098-0.333,2.098H136V68.736c0-2.209-0.791-3.236-3-3.236H40v-5.432c0-1.269,1.038-0.568,2.333-0.568h101.334 c1.243,0,0.333-0.716,0.333,0.568V91.402L144,91.402z" />
</vector>
I spent many dozen hours on finding/creating vector graphics of Lollipop navbar keys as SVG files. I tried many times and many ways to save the corresponding SVG files and convert them to VectorDrawable using this site: http://inloop.github.io/svg2android/
Used a trick to recompile the new xmls and replaced them in the LGSystemUI.apk with my vrtheme engine. But still no success. When the shape of the icon was OK the size of them was never.
Basically I am fully confused why the virtual canvas of the stock icons is 168x168. I am struggling with the fill and stroke color definition as well.
This is the status quo. I hope by starting this thread that together we can solve the problem and get the working source code of the Lollipop navbars. I look forward for any help.
Please note that skin1980 is already involved in the project and I got from him huge help with his intelligent hints.
This is a development thread please do not post comments and remarks that are not intended to provide professional help.
Merry Xmas to all of you!
Vector codes
REAL SOLUTION
Since the release of 20H software version LG also introduced the Lollipop navbar icons. These are defined in LGSystemUI.apk res/drawables folder by xml files [email protected]_button.xml where @ is the corresponding function name (for example ic_sysbar_back_button.xml.
{
"lightbox_close": "Close",
"lightbox_next": "Next",
"lightbox_previous": "Previous",
"lightbox_error": "The requested content cannot be loaded. Please try again later.",
"lightbox_start_slideshow": "Start slideshow",
"lightbox_stop_slideshow": "Stop slideshow",
"lightbox_full_screen": "Full screen",
"lightbox_thumbnails": "Thumbnails",
"lightbox_download": "Download",
"lightbox_share": "Share",
"lightbox_zoom": "Zoom",
"lightbox_new_window": "New window",
"lightbox_toggle_sidebar": "Toggle sidebar"
}
Back button:
Code:
<?xml version="1.0" encoding="utf-8"?>
<vector android:height="34.0dip" android:width="34.0dip" android:viewportWidth="168.0" android:viewportHeight="168.0"
xmlns:android="http://schemas.android.com/apk/res/android">
<path android:fillColor="#ffffffff" android:pathData="M122.132,132c-0.921,0-1.759-0.324-2.435-0.847L44.916,87.979c-0.965-0.499-1.956-0.894-2.525-1.88c-0.338-0.586-0.492-1.221-0.516-1.852c-0.007-0.082-0.004-0.165-0.007-0.247c0.003-0.082,0-0.165,0.007-0.247c0.023-0.632,0.178-1.266,0.516-1.852c0.569-0.987,1.623-1.35,2.525-1.88l74.781-43.175c0.676-0.523,1.514-0.847,2.435-0.847c2.209,0,4,1.791,4,4v88C126.132,130.209,124.341,132,122.132,132zM54.025,84l64.106,37.012V46.988L54.025,84z" />
</vector>
Dual window
Code:
<?xml version="1.0" encoding="utf-8"?>
<vector android:height="34.0dip" android:width="34.0dip" android:viewportWidth="168.0" android:viewportHeight="168.0"
xmlns:android="http://schemas.android.com/apk/res/android">
<path android:fillColor="#ffffffff" android:pathData="M120,36H48c-6.627,0-12,5.373-12,12v72c0,6.627,5.373,12,12,12h72c6.627,0,12-5.373,12-12V48C132,41.373,126.627,36,120,36zM124,120c0,2.209-1.791,4-4,4H48c-2.209,0-4-1.791-4-4V88h80V120zM124,80H44V48c0-2.209,1.791-4,4-4h72c2.209,0,4,1.791,4,4V80z" />
<path android:fillColor="#ffffffff" android:pathData="M85.871,73.958h-4.795V55.041H76.23v-3.065l9.641-2.01V73.958z" />
<path android:fillColor="#ffffffff" android:pathData="M92.177,118.375h-16.38v-3.147l7.762-8.322c1.143-1.307,1.944-2.395,2.406-3.263c0.461-0.868,0.691-1.687,0.691-2.455c0-1.033-0.267-1.865-0.799-2.497c-0.533-0.632-1.31-0.947-2.332-0.947c-1.131,0-1.979,0.371-2.545,1.112c-0.566,0.741-0.85,1.75-0.85,3.023h-4.812c0-2.252,0.73-4.122,2.192-5.61c1.461-1.489,3.465-2.233,6.014-2.233c2.516,0,4.469,0.632,5.858,1.896s2.085,2.988,2.085,5.174c0,1.473-0.388,2.808-1.162,4.005s-2.101,2.807-3.979,4.828l-4.351,4.746h10.2V118.375z" />
</vector>
Home button
Code:
<?xml version="1.0" encoding="utf-8"?>
<vector android:height="34.0dip" android:width="34.0dip" android:viewportWidth="168.0" android:viewportHeight="168.0"
xmlns:android="http://schemas.android.com/apk/res/android">
<path android:fillColor="#ffffffff" android:pathData="M84,131.916c-26.464,0-47.917-21.453-47.917-47.916c0-26.463,21.453-47.917,47.917-47.917S131.917,57.537,131.917,84C131.917,110.465,110.463,131.916,84,131.916zM84,44.333c-21.908,0-39.667,17.76-39.667,39.667c0,21.908,17.76,39.667,39.667,39.667s39.667-17.76,39.667-39.667C123.667,62.093,105.908,44.333,84,44.333z" />
</vector>
Menu button
Code:
<?xml version="1.0" encoding="utf-8"?>
<vector android:height="34.0dip" android:width="34.0dip" android:viewportWidth="168.0" android:viewportHeight="168.0"
xmlns:android="http://schemas.android.com/apk/res/android">
<path android:fillColor="#ffffffff" android:pathData="M40,54h88c2.209,0,4-1.791,4-4s-1.791-4-4-4H40c-2.209,0-4,1.791-4,4S37.791,54,40,54zM128,80H40c-2.209,0-4,1.791-4,4s1.791,4,4,4h88c2.209,0,4-1.791,4-4S130.209,80,128,80zM128,114H40c-2.209,0-4,1.791-4,4s1.791,4,4,4h88c2.209,0,4-1.791,4-4S130.209,114,128,114z" />
</vector>
Notification down
Code:
<?xml version="1.0" encoding="utf-8"?>
<vector android:height="34.0dip" android:width="34.0dip" android:viewportWidth="168.0" android:viewportHeight="168.0"
xmlns:android="http://schemas.android.com/apk/res/android">
<path android:fillColor="#ffffffff" android:pathData="M123,44.179H45c-2.209,0-4-1.791-4-4s1.791-4,4-4h78c2.209,0,4,1.791,4,4S125.209,44.179,123,44.179zM51.181,90.828L79,118.647V58.379c0-2.209,1.791-4,4-4s4,1.791,4,4v60.557l28.025-28.026c1.563-1.562,4.096-1.562,5.656,0c1.563,1.563,1.563,4.096,0,5.658L86.59,130.66c-1.018,1.018-2.445,1.359-3.75,1.052c-1.151,0.114-2.342-0.253-3.224-1.134L45.524,96.486c-1.562-1.563-1.562-4.096,0-5.658C47.086,89.267,49.619,89.267,51.181,90.828z" />
</vector>
Notification up
Code:
<?xml version="1.0" encoding="utf-8"?>
<vector android:height="34.0dip" android:width="34.0dip" android:viewportWidth="168.0" android:viewportHeight="168.0"
xmlns:android="http://schemas.android.com/apk/res/android">
<path android:fillColor="#ffffffff" android:pathData="M123,131.82H45c-2.209,0-4-1.791-4-4s1.791-4,4-4h78c2.209,0,4,1.791,4,4S125.209,131.82,123,131.82zM115.025,77.09L87,49.064v60.556c0,2.209-1.791,4-4,4s-4-1.791-4-4V49.354L51.181,77.172c-1.562,1.563-4.095,1.563-5.657,0c-1.562-1.562-1.562-4.095,0-5.657l34.092-34.092c0.882-0.882,2.073-1.248,3.224-1.134c1.305-0.309,2.733,0.034,3.75,1.052l34.092,34.092c1.563,1.562,1.563,4.095,0,5.657C119.121,78.652,116.588,78.652,115.025,77.09z" />
</vector>
Qmemo button
Code:
<?xml version="1.0" encoding="utf-8"?>
<vector android:height="34.0dip" android:width="34.0dip" android:viewportWidth="168.0" android:viewportHeight="168.0"
xmlns:android="http://schemas.android.com/apk/res/android">
<path android:fillColor="#ffffffff" android:pathData="M87.637,123.2c-19.2,0-43.168,0-43.168,0c-5.523,0-10-4.478-10-10v-66c0-5.523,4.477-10,10-10h66c5.522,0,10,4.477,10,10c0,0,0,23.578,0,42.833c0,7.74-0.167,1.55-0.167,3.667c0,2.116-1.716,3.833-3.833,3.833s-3.832-1.717-3.832-3.833c0-2.117-0.168,1.901-0.168-3.5c0-16.292,0-39,0-39c0-3.313-2.687-6-6-6h-58c-3.313,0-6,2.687-6,6v58c0,3.313,2.688,6,6,6c0,0,22.708,0,39,0c5.402,0-0.117,0.237,2,0.237s3.833,1.717,3.833,3.834s-1.716,3.834-3.833,3.834S95.198,123.2,87.637,123.2z" />
<path android:fillColor="#ffffffff" android:pathData="M102.559,110.938c-3.443-3.053-8.367-8.672-10.938-12.484l-2.563-3.801c-2.572-3.813-1.324-5.215,2.772-3.113l4.082,2.094c4.098,2.102,10.269,6.319,13.711,9.372l22.323,18.669c1.951,1.73,2.128,4.713,0.395,6.661l-0.783,0.881c-1.734,1.947-4.723,2.124-6.675,0.394L102.559,110.938z" />
</vector>
Qslide button
Code:
<?xml version="1.0" encoding="utf-8"?>
<vector android:height="34.0dip" android:width="34.0dip" android:viewportWidth="168.0" android:viewportHeight="168.0"
xmlns:android="http://schemas.android.com/apk/res/android">
<path android:fillColor="#ffffffff" android:pathData="M98,74h26c2.209,0,4-1.791,4-4s-1.791-4-4-4h-16.302l19.515-19.515c1.563-1.562,1.563-4.095,0-5.657c-1.563-1.563-4.095-1.563-5.656,0L102,60.385V44c0-2.209-1.791-4-4-4s-4,1.791-4,4v26C94,72.209,95.791,74,98,74z" />
<path android:fillColor="#ffffffff" android:pathData="M70,94H44c-2.209,0-4,1.791-4,4s1.791,4,4,4h16.301l-19.515,19.516c-1.562,1.563-1.562,4.094,0,5.656c1.563,1.563,4.095,1.563,5.657,0L66,107.615V124c0,2.209,1.791,4,4,4s4-1.791,4-4V98C74,95.791,72.209,94,70,94z" />
<path android:fillColor="#ffffffff" android:pathData="M107.698,102H124c2.209,0,4-1.791,4-4s-1.791-4-4-4H98c-2.209,0-4,1.791-4,4v26c0,2.209,1.791,4,4,4s4-1.791,4-4v-16.385l19.557,19.557c1.563,1.563,4.096,1.563,5.656,0c1.563-1.563,1.563-4.095,0-5.656L107.698,102z" />
<path android:fillColor="#ffffffff" android:pathData="M70,40c-2.209,0-4,1.791-4,4v16.385L46.443,40.829c-1.562-1.563-4.094-1.563-5.657,0c-1.562,1.562-1.562,4.095,0,5.657L60.301,66H44c-2.209,0-4,1.791-4,4s1.791,4,4,4h26c2.209,0,4-1.791,4-4V44C74,41.791,72.209,40,70,40z" />
</vector>
Recent button
Code:
<?xml version="1.0" encoding="utf-8"?>
<vector android:height="34.0dip" android:width="34.0dip" android:viewportWidth="168.0" android:viewportHeight="168.0"
xmlns:android="http://schemas.android.com/apk/res/android">
<path android:fillColor="#ffffffff" android:pathData="M128.041,36.042H39.958c-2.209,0-4,1.791-4,4v87.917c0,2.209,1.791,4,4,4h88.083c2.211,0,4-1.791,4-4V40.042C132.041,37.833,130.252,36.042,128.041,36.042zM123.791,123.041c0,0.553-0.447,1-1,1H44.792c-0.553,0-1-0.447-1-1v-78c0-0.552,0.447-1,1-1h77.999c0.553,0,1,0.448,1,1V123.041z" />
</vector>
Simswitch button
Code:
<?xml version="1.0" encoding="utf-8"?>
<vector android:height="34.0dip" android:width="34.0dip" android:viewportWidth="168.0" android:viewportHeight="168.0"
xmlns:android="http://schemas.android.com/apk/res/android">
<path android:fillColor="#ffffffff" android:pathData="M137.348,121.033h-54.71c-2.569,0-4.653-2.09-4.653-4.668V94.984h-14.7l3.836,3.852c1.558,1.563,1.558,4.096,0,5.656c-0.779,0.781-1.799,1.172-2.82,1.172s-2.042-0.391-2.82-1.172l-10.368-10.41c-1.558-1.563-1.558-4.094,0-5.654l10.369-10.406c1.558-1.563,4.082-1.563,5.64,0c1.558,1.562,1.558,4.095,0,5.656l-3.272,3.285h17.501c2.569,0,4.653,2.09,4.653,4.666v21.352h48.004V67.817l-14.582-12.892H91.881c-2.57,0-4.279-1.465-4.279-4.042c0-2.577,1.709-3.917,4.279-3.917h28.49c1.135,0,2.229,0.416,3.078,1.167l16.979,15.08c1,0.885,1.572,2.16,1.572,3.499v49.653C142,118.943,139.918,121.033,137.348,121.033zM89.988,66.711v6.292h14.457l-3.563-3.576c-1.559-1.561-1.559-4.095,0-5.656c1.559-1.563,4.082-1.563,5.641,0l10.367,10.405c1.559,1.562,1.559,4.094,0,5.656L106.523,90.24c-0.777,0.781-1.801,1.172-2.82,1.172s-2.041-0.391-2.818-1.172c-1.559-1.563-1.559-4.094,0-5.656l3.662-3.677H86.654c-2.569,0-4.653-2.09-4.653-4.667v-8.509L67.605,54.963H33.993v58.017h31.566c2.569,0,4.153,1.434,4.153,4.01s-1.584,4.012-4.153,4.012H30.653c-2.569,0-4.653-2.09-4.653-4.668V51.633c0-2.577,2.083-4.667,4.653-4.667h37.644c1.133,0,2.228,0.416,3.078,1.167l17.04,15.08C89.414,64.098,89.988,65.373,89.988,66.711z" />
</vector>
For all button there is a different code for the transparent version. The above codes are already modified by me because the stock buttons are way too big. See here.
The button size is defined by vector android:height="42.0dip" android:width="42.0dip" and I decreased those values for my Lollipop theme.
In ChupaChups 4.1 you will be able to reduce the navigation bar height which requires the change of the corresponding button height as well.
I hope I helped. Good work with this icons.
Missing codes fixed. We need a proper pathdata for the lollipop icons and the right size definitions.
one might try to rebuild a customized in another lgsystemui with new icons and put them with full apk buttons.
I try this but I'm a little confused. buttons you create are not the photo. I still investigating
forgiveness. My English is the translator of google.
se podria intentar recompilar unos botones customizados en otro lgsystemui con iconos nuevos y meterlos con la apk completa.
yo intente hacer esto pero estoy un poco confuso. los botones que cree no son los de la foto. sigo investigando..
perdon. mi ingles es del traductor de google.
forgive my English.
first.
decompile a LGSystemUI.apk ok kitkat and open ic_sysbar_back.xml
second
decompile framework of kitkat and open values/public
third
decompile framework-res.apk of lollipop and open values/public
ok. ready.
first wanted png that android not use. for example "ic_jog_dial_answer". now, Go to values of lollipop and wanted id public and copy your id. Wanted on public of kitkat and copy your drawable.
Code:
<public type="drawable" name="ic_jog_dial_answer"[COLOR="Red"] id="0x01080371[/COLOR]" />
on lollipop
Code:
<public type="drawable" name="[COLOR="lime"]ic_perm_group_bluetooth[/COLOR]" [COLOR="red"]id="0x0108037[/COLOR]1" />
on kitkat
ok now go to ic_sysbar_back and replace your drawable
Code:
<item android:state_enabled="true" android:state_pressed="false" android:drawable="@[COLOR="Cyan"]*android:[/COLOR]drawable/[COLOR="Lime"]ic_perm_group_bluetooth[/COLOR]" />
<item android:state_enabled="true" android:state_pressed="true" android:drawable="@*android:drawable/ic_perm_group_bookmarks" />
<item android:drawable="@*android:drawable/ic_perm_group_bookmarks" />
</selector>
now recompile your systemui of kitkat and replace ic_sysbar_back on LGsystemUI.apk of lollipop
replace ic_jog_dial_answer.png for your png with this name and copy into framework-res.apk.
now put LGSystemUI.apk into your phone with root explorer and permission.
flash framework-res.apk with the new icons and voila
View attachment 3090021View attachment 3090024
if you want a tutorial in spanish ask to me:good:
edit. if you want test. here have my work.
first put lgsystemui.apk with root explorer and permision
after flash zip keytest.zip
http://www.mediafire.com/download/rabr0kmwv2l8g5g/LGSystemUI.apk
http://www.mediafire.com/download/oeyr76k15vbyye9/keys-test.zip
enjoy
ffalete said:
forgive my English.
first.
decompile a LGSystemUI.apk ok kitkat and open ic_sysbar_back.xml
second
decompile framework of kitkat and open values/public
third
decompile framework-res.apk of lollipop and open values/public
ok. ready.
first wanted png that android not use. for example "ic_jog_dial_answer". now, Go to values of lollipop and wanted id public and copy your id. Wanted on public of kitkat and copy your drawable.
Code:
<public type="drawable" name="ic_jog_dial_answer"[COLOR="Red"] id="0x01080371[/COLOR]" />
on lollipop
Code:
<public type="drawable" name="[COLOR="lime"]ic_perm_group_bluetooth[/COLOR]" [COLOR="red"]id="0x0108037[/COLOR]1" />
on kitkat
ok now go to ic_sysbar_back and replace your drawable
Code:
<item android:state_enabled="true" android:state_pressed="false" android:drawable="@[COLOR="Cyan"]*android:[/COLOR]drawable/[COLOR="Lime"]ic_perm_group_bluetooth[/COLOR]" />
<item android:state_enabled="true" android:state_pressed="true" android:drawable="@*android:drawable/ic_perm_group_bookmarks" />
<item android:drawable="@*android:drawable/ic_perm_group_bookmarks" />
</selector>
now recompile your systemui of kitkat and replace ic_sysbar_back on LGsystemUI.apk of lollipop
replace ic_jog_dial_answer.png for your png with this name and copy into framework-res.apk.
now put LGSystemUI.apk into your phone with root explorer and permission.
flash framework-res.apk with the new icons and voila
View attachment 3090021View attachment 3090024
if you want a tutorial in spanish ask to me:good:
View attachment 3090234View attachment 3090235
edit. if you want test. here have my work.
first put lgsystemui.apk with root explorer and permision
after flash zip keytest.zip
http://www.mediafire.com/download/rabr0kmwv2l8g5g/LGSystemUI.apk
http://www.mediafire.com/download/oeyr76k15vbyye9/keys-test.zip
enjoy
Click to expand...
Click to collapse
Many thanks ffalete. I followed your guide but got the following result:
I am confused with the following steps:
1. When changing the reference in ic_sysbar_(...).xml you said
Code:
android:drawable="@*android:drawable/ic_perm_group_bookmarks" />
I used:
Code:
android:drawable="@drawable/ic_perm_group_bookmarks" />
The * is not required, isn't it?
The navbar icons are 128X128. I put them into the xhdpi folder of framework-res.apk with the name "ic_perm_group_bookmarks".
What am I doing wrong? I had the same problems before the system loads different icons.
Do you know how to change the keys in the appdrawer?
*android: is requiered because this command is for framework.
if you do not put the framework will read
ffalete said:
*android: is requiered because this command is for framework.
if you do not put the framework will read
Click to expand...
Click to collapse
here you have the mod whith your vrtheme.
open the zip and decompile the xml of lgsystemui for compare.:good:
the vrtheme is funtional. you can flash on your phone
Great job! It works. Next step is to make the navbar transparent.
That is already more complicated jejejejeje.
For now we have to settle for this. you know
:laugh::laugh:
ffalete said:
That is already more complicated jejejejeje.
For now we have to settle for this. you know
:laugh::laugh:
Click to expand...
Click to collapse
Can you add up / down buttons and menu?
Here you have[emoji1]
http://www.mediafire.com/download/428x3w987mne9ck/test_navvar2.zip
ffalete said:
Here you have[emoji1]
http://www.mediafire.com/download/428x3w987mne9ck/test_navvar2.zip
Click to expand...
Click to collapse
Can you, please, NavBar botton "Menu" to activate?
According to your instructions, I did not get
There is no need for menu button just longpress recent button.
Is theres a way to resize the Navigation Bar Icons on Lollipop Custom ROM (AHD9.1) its way too big for my liking.
Sent from my LG-D855 using XDA Premium 4 mobile app
jeffzmagboo said:
Is theres a way to resize the Navigation Bar Icons on Lollipop Custom ROM (AHD9.1) its way too big for my liking.
Sent from my LG-D855 using XDA Premium 4 mobile app
Click to expand...
Click to collapse
Yes, use ChupaChups4.
OP updated with useful information.
thanks for share my friend just a small question on post 2 why back buttom have different size from the rest?
hugs !
Crash said:
thanks for share my friend just a small question on post 2 why back buttom have different size from the rest?
hugs !
Click to expand...
Click to collapse
Hey, my mistake, fixed.
Kickoff said:
Hey, my mistake, fixed.
Click to expand...
Click to collapse
Don´t worry jus one more question hehe sorry for disturb theres two files for example
ic_sysbar_back_button and ic_sysbar_back_button_trans do we have to change the size on both files or just in the file without the "transparent" ?
Hugs my friend
Both

Hook Layout

Hi.
I've a layout with code like:
Code:
<com.app.ConversationContentLayout android:id="@id/conversation_layout" android:layout_width="fill_parent" android:layout_height="fill_parent"
xmlns:android="http://schemas.android.com/apk/res/android">
// FIRST CASE:
<LinearLayout android:orientation="horizontal" android:id="@id/input_layout_content" SOME OTHER CODE >
<ImageButton android:layout_gravity="bottom" android:id="@id/1" android:layout_width="48.0dip" SOME OTHER CODE/>
</LinearLayout>
//SECOND CASE:
<ImageButton android:layout_gravity="bottom|center|right" android:id="@id/2" SOME OTHER CODE/>
</com.app.ConversationContentLayout>
So, i can hook layout if first case, but i can't modify in second case. Code:
Code:
ImageButton first = (ImageButton) liparam.view.findViewById(
liparam.res.getIdentifier("1", "id", "com.app"));
LinearLayout.LayoutParams linearLayoutParams = new LinearLayout.LayoutParams(0, 0);
first.setLayoutParams(linearLayoutParams);
ImageButton second = (ImageButton) liparam.view.findViewById(
liparam.res.getIdentifier("2", "id", "com.app"));
LayoutParams frameLayoutParamSs = new LayoutParams(0, 0);
second.setLayoutParams(frameLayoutParamSs);
Problem is that is first case i can use 'LinearLayout.LayoutParams', but in second case i can't. What should i use? Simply using LayoutParams it crash, using RelativeLayout.LayoutParams does nothing, if i'm hooking the right thing.
Thanks
Edit: I solve in other way, but i didn't know how to solve that specific problem

[GUIDE][4.3 - 5.x.x] Xperia Lockscreen with Graphic Visualizer

Yep, this could sounds to repost, but not, in this case the Porting Guide works with 4.4.x (KitKat) too.
Let's go with this, then:
For try port to LP: here
If you, don't understand that guide, here I've a explain (In spanish only):
Requirements
- Have a Deodex ROM (Really Important)
- Have the signature verification for all apps disabled (a.k.a Superuser Mod) installed.
- Know compile/decompile and sign apps (here a lite guide, I recommend download it)
- Brain (Not much xD )
- Patient
- Notepad++
- Latest apktool (in this case)
First, JellyBean (4.3)
Step 1
- Decompile XperiaLockScreen.apk
- Download Smali for JB 4.3 Lockscreen (In Download Section) and merge "smali" folder to your decompiled XperiaLockScreen
Step 2
Go to XperiaLockScreen/res/layout/keyguard_no_security_view.xml, search the follow line
Code:
[COLOR="RoyalBlue"]<LinearLayout android:gravity="center" android:layout_gravity="center_horizontal" android:orientation="vertical" android:layout_width="fill_parent" android:layout_height="wrap_content" android:layout_alignParentBottom="true">[/COLOR]
and add the red line down
Code:
[COLOR="Red"]<com.adi.rom.interface.MusicEqualizerVisualizer android:layout_gravity="bottom" android:id="@id/new_visualizer_view_panel" android:layout_width="fill_parent" android:layout_height="fill_parent" android:layout_marginBottom="0.0dip">
<FrameLayout android:id="@id/new_custom_visualizer_view_panel" android:layout_width="fill_parent" android:layout_height="fill_parent">
<com.adi.rom.interface.VisualizerView android:id="@id/new_custom_visualizer_view" android:visibility="gone" android:layout_width="fill_parent" android:layout_height="fill_parent" />
</FrameLayout>
</com.adi.rom.interface.MusicEqualizerVisualizer>[/COLOR]
Some like this
{
"lightbox_close": "Close",
"lightbox_next": "Next",
"lightbox_previous": "Previous",
"lightbox_error": "The requested content cannot be loaded. Please try again later.",
"lightbox_start_slideshow": "Start slideshow",
"lightbox_stop_slideshow": "Stop slideshow",
"lightbox_full_screen": "Full screen",
"lightbox_thumbnails": "Thumbnails",
"lightbox_download": "Download",
"lightbox_share": "Share",
"lightbox_zoom": "Zoom",
"lightbox_new_window": "New window",
"lightbox_toggle_sidebar": "Toggle sidebar"
}
Save it.
Step 3
Go to XperiaLockScreen/res/values/colors.xml
add these lines before of </resources>
Code:
[COLOR="Red"]<color name="new_custom_equalizer_fill_color">@color/didi2</color>
<color name="didi">@com.sonyericsson.uxp:color/somc_theme_accent_color_light</color>
<color name="didi2">@com.sonyericsson.uxp:color/somc_theme_accent_color_dark</color>
<color name="didi3">@com.sonyericsson.uxp:color/somc_accent_color_neutral</color>
<color name="didi4">@com.sonyericsson.uxp:color/semc_theme_illumination_color</color>[/COLOR]
If these lines don't leave compile, use only this
Code:
[COLOR="red"]<color name="new_custom_equalizer_fill_color">#96ffffff</color>[/COLOR]
Save it.
Go to XperiaLockScreen/res/values/dimens.xml
and add before of </resources>
Code:
[COLOR="red"] <dimen name="new_custom_eqalizer_path_effect_1">12.0dip</dimen>
<dimen name="new_custom_eqalizer_path_effect_2">1.0dip</dimen>
<dimen name="new_custom_eqalizer_path_stroke_width">24.0dip</dimen>[/COLOR]
Save it.
Go to XperiaLockScreen/res/values/ids.xml
and add before of </resources>
Code:
[COLOR="red"]<item type="id" name="new_visualizer_view_panel">false</item>
<item type="id" name="new_custom_visualizer_view_panel">false</item>
<item type="id" name="new_custom_visualizer_view">false</item>[/COLOR]
Save it.
Go to XperiaLockScreen/res/values/integers.xml
and add before of </resources>
Code:
[COLOR="red"]<integer name="new_custom_equalizer_divisions">4</integer>
<integer name="new_custom_equalizer_db_fuzz_factor">2</integer>
<integer name="new_custom_equalizer_db_fuzz">-10</integer>[/COLOR]
Step 4
Go to XperiaLockScreen/AndroidManifest.xml
and search
Code:
[COLOR="royalblue"]<uses-permission android:name="com.sonymobile.permission.READ_LOCKSCREEN_WALLPAPER"/>[/COLOR]
add the follow lines down
Code:
[COLOR="red"]<uses-permission android:name="android.permission.RECORD_AUDIO"/>
<uses-permission android:name="android.permission.MODIFY_AUDIO_SETTINGS"/>[/COLOR]
Step 5
- Compile XperiaLockScreen
- Sign it
- Push to System/app with the right permissions
- Download VisualizerStyleSettings.apk (from Download section) push to System/app with right permissions
Now with KitKat (4.4.x)
Step 1
- Decompile XperiaLockScreen.apk
- Download Smali for JB 4.3 Lockscreen (Yep, the same file, in Download Section) and merge "smali" folder to your decompiled XperiaLockscreen
Step 2
Go to XperiaLockScreen/res/layout/keyguard_no_security_view.xml, search the follow line
Code:
[COLOR="RoyalBlue"]<LinearLayout android:gravity="center" android:layout_gravity="center_horizontal" android:orientation="vertical" android:layout_width="fill_parent" android:layout_height="wrap_content" android:layout_alignParentBottom="true">[/COLOR]
and add the red line down
Code:
[COLOR="Red"]<com.adi.rom.interface.MusicEqualizerVisualizer android:layout_gravity="bottom" android:id="@id/new_visualizer_view_panel" android:layout_width="fill_parent" android:layout_height="fill_parent" android:layout_marginBottom="0.0dip">
<FrameLayout android:id="@id/new_custom_visualizer_view_panel" android:layout_width="fill_parent" android:layout_height="fill_parent">
<com.adi.rom.interface.VisualizerView android:id="@id/new_custom_visualizer_view" android:visibility="gone" android:layout_width="fill_parent" android:layout_height="fill_parent" />
</FrameLayout>
</com.adi.rom.interface.MusicEqualizerVisualizer>[/COLOR]
Some like this
Save it.
Step 3
Go to XperiaLockScreen/res/values/dimens.xml
and add before of </resources>
Code:
[COLOR="red"] <dimen name="new_custom_eqalizer_path_effect_1">12.0dip</dimen>
<dimen name="new_custom_eqalizer_path_effect_2">1.0dip</dimen>
<dimen name="new_custom_eqalizer_path_stroke_width">24.0dip</dimen>[/COLOR]
Save it.
Go to XperiaLockScreen/res/values/ids.xml
and add before of </resources>
Code:
[COLOR="red"]<item type="id" name="new_visualizer_view_panel">false</item>
<item type="id" name="new_custom_visualizer_view_panel">false</item>
<item type="id" name="new_custom_visualizer_view">false</item>[/COLOR]
Save it.
Go to XperiaLockScreen/res/values/integers.xml
and add before of </resources>
Code:
[COLOR="red"] <integer name="new_custom_equalizer_divisions">13</integer>
<integer name="new_custom_equalizer_db_fuzz_factor">20</integer>
<integer name="new_custom_equalizer_db_fuzz">-10</integer>[/COLOR]
Step 4
Go to XperiaLockScreen/AndroidManifest.xml
and search
Code:
[COLOR="royalblue"]<uses-permission android:name="com.sonymobile.permission.READ_LOCKSCREEN_WALLPAPER"/>[/COLOR]
add the follow lines down
Code:
[COLOR="red"]<uses-permission android:name="android.permission.RECORD_AUDIO"/>
<uses-permission android:name="android.permission.MODIFY_AUDIO_SETTINGS"/>[/COLOR]
Step 5
- Compile XperiaLockScreen
- Sign it
- Push to System/app with the right permissions
- Download VisualizerStyleSettings.apk (from Download section) push to System/app with right permissions
Step 6
- Decompile SystemUI.apk
- Download Smali for KK-LP SystemUI (In Download Section) and merge "smali" folder to your decompiled SystemUI
Step 7
Go to SystemUI/res/layout/status_bar_expanded.xml, search the follow line
Code:
[COLOR="RoyalBlue"]
</LinearLayout>[/COLOR]
and add the red line down
Code:
[COLOR="Red"]<com.adi.rom.interface.MusicEqualizerVisualizer android:layout_gravity="bottom" android:id="@id/new_visualizer_view_panel" android:layout_width="fill_parent" android:layout_height="fill_parent" android:layout_marginBottom="0.0dip">
<FrameLayout android:id="@id/new_custom_visualizer_view_panel" android:layout_width="fill_parent" android:layout_height="fill_parent">
<com.adi.rom.interface.VisualizerView android:id="@id/new_custom_visualizer_view" android:visibility="gone" android:layout_width="fill_parent" android:layout_height="fill_parent" />
</FrameLayout>
</com.adi.rom.interface.MusicEqualizerVisualizer>[/COLOR]
Save it.
Step 8
Go to SystemUI/res/values/colors.xml
add this line before of </resources>
Code:
[COLOR="red"]<color name="new_custom_equalizer_fill_color">#96ffffff</color>[/COLOR]
Save it.
Go to SystemUI/res/values/dimens.xml
and add before of </resources>
Code:
[COLOR="red"]<dimen name="new_custom_eqalizer_path_effect_1">6.0dip</dimen>
<dimen name="new_custom_eqalizer_path_effect_2">1.0dip</dimen>
<dimen name="new_custom_eqalizer_path_stroke_width">6.0dip</dimen>[/COLOR]
Save it.
Go to SystemUI/res/values/ids.xml
and add before of </resources>
Code:
[COLOR="red"]<item type="id" name="new_visualizer_view_panel">false</item>
<item type="id" name="new_custom_visualizer_view_panel">false</item>
<item type="id" name="new_custom_visualizer_view">false</item>[/COLOR]
Save it.
Go to SystemUI/res/values/integers.xml
and add before of </resources>
Code:
[COLOR="red"]<integer name="new_custom_equalizer_divisions">4</integer>
<integer name="new_custom_equalizer_db_fuzz_factor">2</integer>
<integer name="new_custom_equalizer_db_fuzz">-10</integer>[/COLOR]
Step 9
Go to SystemUI/AndroidManifest.xml
and search
Code:
[COLOR="royalblue"]<uses-permission android:name="android.permission.WRITE_SYNC_SETTINGS"/>[/COLOR]
add the follow lines down
Code:
[COLOR="red"]<uses-permission android:name="android.permission.RECORD_AUDIO"/>
<uses-permission android:name="android.permission.MODIFY_AUDIO_SETTINGS"/>[/COLOR]
Step 10
- Compile SystemUI
- Sign it
- Push to System/app with the right permissions
- Download VisualizerStyleSettings.apk (from Download section) push to System/app with right permissions
Screenies & Demo
JB 4.3
KK 4.4.x (CyanogenMod Visualizer don't works)
LP 5.x.x (Works almost all, except Lines Visualizer on Stock ROM)
Demo
Downloads
Smalies for JB 4.3
Smalies for KK/LP SystemUI
VisualizerStyleSettings
VisualizerStyleSettings Fix for Lollipop
Credits
@idid idamrep (For their port to JB 4.3)
@Adi Aisiteru Reborn (For their Guide for port to "All" Android devices)
@sebasrock156 (For port to KitKat and make this possible)

[Mod][stock N 7.1.1] Customize Status and Navigation Bars

Here's what I did:
- Decompile SystemUI.
- Create 2 xml drawable files, one for status bar,
Code:
<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="rectangle">
<gradient android:startColor="#ff607d8b" android:endColor="#ff121518" android:angle="270" />
<stroke android:width="1.0dip" android:color="#ffbdbdbd" />
<corners android:radius="-10.0dip" />
<padding android:bottom="-2dip" />
</shape>
And one for navigation bar,
Code:
<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="rectangle">
<gradient android:startColor="#ff607d8b" android:endColor="#ff121518" android:angle="90" />
<stroke android:width="1.0dip" android:color="#ffbdbdbd" />
<corners android:radius="-10.0dip" />
<padding android:top="-2dip" />
</shape>
(Note the difference; the gradient radius of one is 180 degrees different than the other, so the gradients work towards each other from the edges, and the negative padding is on the top for the navigation bar, but the bottom for the status bar, because I wanted the 'stroke' to show on the edge of the screen only.)
Name them whatever you want, and copy the 2 files to /res/drawable.
- Open /res/layout/status_bar xml, and find
Code:
<LinearLayout android:orientation="horizontal" android:id="@id/status_bar_contents"
and after that, add 'android:background="@drawable/(name of status bar file)'.
- Open res/layout/navigation_layout.xml and find
Code:
<FrameLayout android:id="@id/nav_buttons"
and do the same thing, but using the name of your navigation bar file.
(you may have to do the same to 'navigation_bar.xml and/or 'navigation_layout_rot90'. I did it just in case, but not sure if necessary)
- Recompile, sign, push, reboot.
My files are attached, but you can edit or mod or make your own however you want...
Note: If your status bar background is too small on lock screen, go to /res/values/dimens.xml, and find
Code:
<dimen name="status_bar_header_height_keyguard">32.0dip</dimen>
and make it smaller, like 32 instead of 40...
Variation -
Status bar
Code:
<?xml version="1.0" encoding="UTF-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android" >
<item>
<shape android:shape="rectangle" >
<gradient
android:angle="90"
android:startColor="#1a000000"
android:endColor="#ff297aff"
android:type="linear" />
<size android:width="24dp"
android:height="24dp"/>
</shape>
</item>
<item
android:bottom="1dp"
android:left="1dp"
android:right="1dp"
android:top="1dp">
<shape android:shape="rectangle" >
<gradient
android:angle="90"
android:startColor="#1a121518"
android:endColor="#66121518"
android:centerColor="#d978909c"
android:type="linear" />
</shape>
</item>
</layer-list>
Nav bar
Code:
<?xml version="1.0" encoding="UTF-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android" >
<item>
<shape android:shape="rectangle" >
<gradient
android:angle="270"
android:startColor="#1a000000"
android:endColor="#ff297aff"
android:type="linear" />
<size android:width="24dp"
android:height="24dp"/>
</shape>
</item>
<item
android:bottom="2dp"
android:left="2dp"
android:right="2dp"
android:top="2dp">
<shape android:shape="rectangle" >
<gradient
android:angle="270"
android:startColor="#1a121518"
android:endColor="#66121518"
android:centerColor="#d978909c"
android:type="linear" />
</shape>
</item>
</layer-list>
- Screenshot 1 and 2 -
(Note - I don't think 'size' line is important here. I used it for something else, and just decided to leave it...)
Adjust as you like...
_____________
If you like rounded corners
Status bar
Code:
<?xml version="1.0" encoding="UTF-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android" >
<item>
<shape android:shape="rectangle" >
<gradient
android:angle="90"
android:startColor="#1a000000"
android:endColor="#ff297aff"
android:type="linear" />
[COLOR="red"]<corners android:topLeftRadius="20.0dip" android:topRightRadius="20.0dip" />[/COLOR]
</shape>
</item>
<item
android:bottom="1dp"
android:left="1dp"
android:right="1dp"
android:top="1dp">
<shape android:shape="rectangle" >
<gradient
android:angle="90"
android:startColor="#1a121518"
android:endColor="#66121518"
android:centerColor="#d978909c"
android:type="linear" />
[COLOR="red"]<corners android:topLeftRadius="20.0dip" android:topRightRadius="20.0dip" />[/COLOR]
</shape>
</item>
</layer-list>
(lines in red)
Nav bar
Code:
<?xml version="1.0" encoding="UTF-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android" >
<item>
<shape android:shape="rectangle" >
<gradient
android:angle="270"
android:startColor="#1a000000"
android:endColor="#ff297aff"
android:type="linear" />
[COLOR="red"]<corners android:bottomLeftRadius="20.0dip" android:bottomRightRadius="20.0dip" />[/COLOR]
</shape>
</item>
<item
android:bottom="2dp"
android:left="2dp"
android:right="2dp"
android:top="2dp">
<shape android:shape="rectangle" >
<gradient
android:angle="270"
android:startColor="#1a121518"
android:endColor="#66121518"
android:centerColor="#d978909c"
android:type="linear" />
[COLOR="red"]<corners android:bottomLeftRadius="20.0dip" android:bottomRightRadius="20.0dip" />[/COLOR]
</shape>
</item>
</layer-list>
- Screenshot 3 and 4 -
how can i have a rounded corner status bar & nav bar?
is it tha xmls on tha first post i ll use or what brov?
i just want tha rounded corner.
whalesplaho said:
how can i have a rounded corner status bar & nav bar?
is it tha xmls on tha first post i ll use or what brov?
i just want tha rounded corner.
Click to expand...
Click to collapse
You can do this
Code:
<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="rectangle">
<stroke android:width="1.0dip" android:color="#(whatever you want)" />
<corners android:bottomLeftRadius="(whatever you want)" android:bottomRightRadius="(whatever you want)" />
</shape>
Or Roundr - https://play.google.com/store/apps/...app&pcampaignid=APPU_1_BVR0WvTWO4TykwW06r_4DA
levone1 said:
You can do this
Code:
<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="rectangle">
<stroke android:width="1.0dip" android:color="#(whatever you want)" />
<corners android:bottomLeftRadius="(whatever you want)" android:bottomRightRadius="(whatever you want)" />
</shape>
Or Roundr - https://play.google.com/store/apps/...app&pcampaignid=APPU_1_BVR0WvTWO4TykwW06r_4DA
Click to expand...
Click to collapse
I prefer tha modding style but I dnt know where to add that code buddy...
Thanks.
whalesplaho said:
I prefer tha modding style but I dnt know where to add that code buddy...
Thanks.
Click to expand...
Click to collapse
Follow op of this thread - Make an xml, put it in drawable folder of systemui, then add 'android:background...' code to status bar and nav bar layouts. Note that for status bar, you want round corners on top, and for nav bar on bottom, ('topLeftRadius' + 'topRightRadius' vs. 'bottomLeftRadius' + 'bottomRightRadius')...
Lemme try modding and see tha outcome buddy....

Categories

Resources