Feature request: (Textfield) Battery Level indication

Hi, big fan here. Keep up the good work.

I'm trying to create a text field on the home screen wich indicates the battery level (like done in 'Settings - System Information - Overview', it works over there). The reason is that I run Kodi (only) on several (mobile) tablets and there is NO battery indication or watchdog in the Android-OS active anymore.

But I can't seem to find my way 'into the code' properly, yet. I've tried to replicate the weather indications in Home.xml and adding the lines of code from "SettingsSystemInfo.xml" Tried to make it exactly like the 'Estuary MOD v2'-option: "Show weather in top section". I don't fully understand the file-structures and xml references yet...

Unfortunatly there no battery-image anywere in Textures.xbt so this needs to be added if an icon needs to be displayed.

It would be awesome if a feature like this was build-in, into the skin. Even better with a ON/OFF switch in Skin-settings, just like the show-weather option.

Zitat von PvD

I will integrate this display into the Estuary Mod V2 skin. Please ask for feature requests regarding the mod in this thread: Estuary Mod v2

Oh, wow... many thanks! I didn't expect to be picked up this quickly
I will use the proper 'Feature Request' category in the future.

Zitat von DaVu

This string "Battery level" has its source here:

https://github.com/xbmc/xbmc/blob….po#L6098-L6100

As you can see, there's a number for it "12395"

If you look here: https://github.com/xbmc/xbmc/blob…emInfo.cpp#L103

you will find the same number as well. So it's not even placed directly in the skin itself. Those windows with their stings and infos they are showing are created by Kodi core code. So finding it in the skin is nearly impossible at least for this specific section.

But, there's a solution...called "InfoLabels": https://kodi.wiki/view/InfoLabels#System

If you search that site for "Batterylevel", you will find the specific InfoLabel which you are able to implement yourself using "Label controls": https://kodi.wiki/view/Label_control

Those labels with their specific coordinates to match the location on the screen you would like them to have, can be implemented easily. Even inside the "Home.xml"

I guess it's simply you didn't know of that info label

Alles anzeigen

Many thanks for explaining, now I understand how this structure works..!
I saw these strings "InfoLabels" and tried to make them appear in a textbox but this didnt work. xD
Thanks again.

Zitat von PvD

Has been done

As I don't have any mobile devices running Kodi I'm not shure if this modification is running properly - so I ask for verification. The color should change from skin color to red if battery level is below 10%.

Download from Github https://github.com/b-jesch/skin.e…heads/Nexus.zip, rename the root folder inside the zip from skin.estuary.modv2-Nexus to skin.estuary.modv2 and install from zip inside Kodi.

Verified. It's in Nerdrepo now.

Wow, many, many thanks for this quick-fix! Works like a charm, but...

...I immediatly altered some code to my own wishes, why?

1. To NOT use the skin color but solid green, and;
   Because it was confusing when using an orange skin-color.
   And perhaps this is a great option to have in Skin-Settings? See bottom.
   
2. To add extra indication (4-stages), RED, ORANGE, GREEN and Screaming GREEN. For when the battery turns 0-10%, 10-20%, 20-80%, 80-100% (See altered code below)
3. Additional: I looked into 'InfoLabels' but unfortunatly there is no flag for "BatteryCharging"
   (This would make a great addition to Kodi and gives us the oppertunity to add a 'lightning-bolt.png' when charging)

--

Altered code (addons/skin.estuary.modv2/xml/Includes.xml) with full 'includes lines' (starting at line 2993)
EDIT: Ah sh*t. Double integers doesn't work I see, after testing.  

<include name="BatteryIndicator">
        <param name="top">16</param>
        <param name="left">10</param>
        <param name="width">120</param>
        <definition>
            <control type="group">
                <top>$PARAM[top]</top>
                <width>$PARAM[width]</width>
                <left>$PARAM[left]</left>
                <height>26</height>
                <visible>Skin.HasSetting(show_battery)</visible>
                <control type="image">
                    <width>100</width>
                    <height>26</height>
                    <texture>flags/battery_load.png</texture>
                </control>
            <!--Battery Level 0-10% RED-->
                <control type="progress">
                    <top>8</top>
                    <left>11</left>
                    <width>25</width>
                    <height>10</height>
                    <texturebg border="3" colordiffuse="$VAR[BackgroundColorVar]">colors/white50.png</texturebg>
                    <midtexture colordiffuse="FFFF0000">colors/white.png</midtexture>
                    <info>System.BatteryLevel</info>
                    <visible>Integer.IsLessOrEqual(System.BatteryLevel,10)</visible>
                </control>
            <!--Battery Level 10-20% ORANGE-->
                <control type="progress">
                    <top>8</top>
                    <left>11</left>
                    <width>25</width>
                    <height>10</height>
                    <texturebg border="3" colordiffuse="$VAR[BackgroundColorVar]">colors/white50.png</texturebg>
                    <midtexture colordiffuse="FFD68A59">colors/white.png</midtexture>
                    <info>System.BatteryLevel</info>
                    <visible>Integer.IsGreaterOrEqual(System.BatteryLevel,10)</visible>
                    <visible>Integer.IsLessOrEqual(System.BatteryLevel,19)</visible>
                </control>
            <!--Battery Level 20-80% DARK GREEN-->
                <control type="progress">
                    <top>8</top>
                    <left>11</left>
                    <width>25</width>
                    <height>10</height>
                    <texturebg border="3" colordiffuse="$VAR[BackgroundColorVar]">colors/white50.png</texturebg>
                    <midtexture colordiffuse="FF1CAC78">colors/white.png</midtexture>
                    <info>System.BatteryLevel</info>
                    <visible>Integer.IsGreaterOrEqual(System.BatteryLevel,20)</visible>
                    <visible>Integer.IsLessOrEqual(System.BatteryLevel,79)</visible>
                </control>
            <!--Battery Level 80-100% SCREAMING GREEN-->
                <control type="progress">
                    <top>8</top>
                    <left>11</left>
                    <width>25</width>
                    <height>10</height>
                    <texturebg border="3" colordiffuse="$VAR[BackgroundColorVar]">colors/white50.png</texturebg>
                    <midtexture colordiffuse="FF76FF7A">colors/white.png</midtexture>
                    <info>System.BatteryLevel</info>
                    <visible>Integer.IsGreaterOrEqual(System.BatteryLevel,80)</visible>
                    <visible>Integer.IsLessOrEqual(System.BatteryLevel,100)</visible>
                </control>
                <control type="label">
                    <top>-2</top>
                    <left>45</left>
                    <width>50</width>
                    <font>font09</font>
                    <align>center</align>
                    <label>$INFO[System.BatteryLevel]</label>
                </control>
            </control>
        </definition>
    </include>

Making this controllable via Skin-Settings would also be a great addition I guess (when I get around to this I will try this myself and share these alterations).
(But maybe it's too much settings-control....I don't know). Estuary MOD v2 Skin-settings, feature request for Battery indicator:

• When Skin-settings-option "Show Battery Level" is active,
  [Show sub-settings-option]
  • Select-color-option: "Use Skin default Values" or "Color Picker"
    (Same as in "Skin-settings - Colors")
  • Choose-levels:
    
    • Enter Battery empty Enter (Red) values (default: 0-10);
    • Enter Battery almost empty Enter (Orange) values (default: 10-20);
    • Optional: Battery charged Enter (Dark-Green / Safe zone) values (default: 20-80);
    • Optional: Battery full Enter (Light-Green) values (default: 80-100).
  • Show Percentage? (ON/OFF)
    (When sub-options 'Choose levels' is possible this will also be a great addition to make into a Skin-Settings-Option, and maybe with bigger battery when turned OFF)

Nice, brain-farts-and-ideas purged right, feeling relaxed. Thanks again!

Zitat von PvD

Great that You feeled relaxed now . In my opinion an indication with red color bar on low level battery is enough because there is a display of numeric value too. Also customize the battery level within the skin settings makes this a little bit overload. Most users will not use this indicator, as they do not use mobile devices at all. But feel free to modify the skin for your needs. Be aware that your modifications will be overwritten on a skin update, so you have to save/restore your modifications to/from a safe place.

My sentimence exactly, most users won't use these settings but it came to mind when playing around with this code. Better to let the brainfarts out, I always say brings the mind peace.

And you're absolutely right; Less is more and there's enough already... propably too much settings already, for most (the Estuary MOD is truely a magnificent writing, especially now when i see how quickly it gets complex (and I still don't understand the ID's and references it as of right now )).

Thanks for tip; I will adapt these settings myself, and keep safe in duplicate folders with another addon-name.

Maybe I'll try some custom 'includes' now with some 'Skin.HasSetting()' functions so I can implement my own toggles and values in Skin-Settings.

Nice to (really) get to know Kodi this way (I've been a user ever since my (self-) modded/soldered Xbox with xbmc v1 back in the day), thanks for sharing all this!

Zitat von PvD

You can extremely shorten the code for the include using variables for the battery level:

XML

<include name="BatteryIndicator">
    <param name="top">16</param>
    <param name="left">10</param>
    <param name="width">120</param>
    <definition>
        <control type="group">
            <top>$PARAM[top]</top>
            <width>$PARAM[width]</width>
            <left>$PARAM[left]</left>
            <height>26</height>
            <visible>Skin.HasSetting(show_battery)</visible>
            <control type="image">
                <width>100</width>
                <height>26</height>
                <texture>flags/battery_load.png</texture>
            </control>
            <control type="progress">
                <top>8</top>
                <left>11</left>
                <width>25</width>
                <height>10</height>
                <texturebg border="3" colordiffuse="$VAR[BackgroundColorVar]">colors/white50.png</texturebg>
                <midtexture colordiffuse="$VAR[BatteryLevelColorVar]">colors/white.png</midtexture>
                <info>System.BatteryLevel</info>
            </control>
            <control type="label">
                <top>-2</top>
                <left>45</left>
                <width>50</width>
                <font>font09</font>
                <align>center</align>
                <label>$INFO[System.BatteryLevel]</label>
            </control>
        </control>
    </definition>
</include>

Alles anzeigen

Put the variable $VAR[BatteryLevelColorVar] into Variables.xml:

XML

<variable name="BatteryLevelColorVar">
    <value condition="Integer.IsLessOrEqual(System.BatteryLevel,10)">FFFF0000</value>
    <value condition="Integer.IsGreater(System.BatteryLevel,10) + Integer.IsLessOrEqual(System.BatteryLevel,20)">FFD68A59</value>
    <value condition="Integer.IsGreater(System.BatteryLevel,20) + Integer.IsLessOrEqual(System.BatteryLevel,80)">FF1CAC78</value>

    <value>FF76FF7A</value>
</variable>

Okay, like this. Now I get references (pretty much).

Thanks for your example! Questions:

1. So can assume that the code ALWAYS works/reads in line-order?
   In your example the output would than be "<value>FF76FF7A</value>" if no value matches in the lines above? And therefore also the reason you start with lowest value? (So reversed this would work just as well (this just for my own understanding)).
   
2. Is there a cheatsheet, guide or list to visualise or index these references? (otherwise I'll start making my own as a go along but this will probably take forever to discover, draw, and re-draw each time, properly).

So, using all these references brings pretty much an unlimited config because you can add ANY string you like? Like a variable, layout, image-(/file-) , xml-reference. Wow, respect +100 for Kodi's inner workings and skinning, wich such an extended scripting still managing to work this fast is amazing.

Zitat von emilflorisse

My sentimence exactly, most users won't use these settings but it came to mind when playing around with this code. Better to let the brainfarts out, I always say brings the mind peace.

And you're absolutely right; Less is more and there's enough already... propably too much settings already, for most (the Estuary MOD is truely a magnificent writing, especially now when i see how quickly it gets complex (and I still don't understand the ID's and references it as of right now )).

Thanks for tip; I will adapt these settings myself, and keep safe in duplicate folders with another addon-name.

Maybe I'll try some custom 'includes' now with some 'Skin.HasSetting()' functions so I can implement my own toggles and values in Skin-Settings.

Nice to (really) get to know Kodi this way (I've been a user ever since my (self-) modded/soldered Xbox with xbmc v1 back in the day), thanks for sharing all this!

Aaaah, I see the "$VAR" reference to "Variables.xml" now so there must be a starting point defining all these strings to their xml-files(?).

I will start on the Kodi-wiki section skinning first before you all have to start giving me a full course here

Thanks for all the info and links, I've been reading up and playing around with more knowledge of the inner workings now.

To finalise the 'Battery Level Indicator' (for me) and make slitely better graphics, especially for clearer view on smaller devices. I made;

• Added new image .png file (battery_load_full.png) https://pasteboard.co/RrnnJo9lpWGt.png ;
• Align the <label> indicator to fit right in the middel of the new image;
• Rescaled the "progress" bar to fit inside the new image;
• Created a new Variable [BatteryLevelTextColorVar] to also switch the text-color from dark to light (below 30%)

Edited lines in "Includes.xml" starting at line 2987:

    <include name="BatteryIndicator">
        <param name="top">13</param>
        <param name="left">10</param>
        <param name="width">120</param>
        <definition>
            <control type="group">
                <top>$PARAM[top]</top>
                <width>$PARAM[width]</width>
                <left>$PARAM[left]</left>
                <height>26</height>
                <visible>Skin.HasSetting(show_battery)</visible>
                <control type="image">
                    <width>100</width>
                    <height>26</height>
                    <texture>flags/battery_load_full.png</texture>
                </control>
                <control type="progress">
                    <top>3</top>
                    <left>6</left>
                    <width>88</width>
                    <height>20</height>
                    <texturebg border="3" colordiffuse="$VAR[BackgroundColorVar]">colors/white50.png</texturebg>
                    <midtexture colordiffuse="$VAR[BatteryLevelColorVar]">colors/white.png</midtexture>
                    <info>System.BatteryLevel</info>
                </control>
                <control type="label">
                    <top>-2</top>
                    <left>25</left>
                    <width>50</width>
                    <font>font09</font>
                    <align>center</align>
                    <label>$INFO[System.BatteryLevel]</label>
                    <textcolor>$VAR[BatteryLevelTextColorVar]</textcolor>
                </control>
            </control>
        </definition>
    </include>

Edited (extisting) variable in "Variables.xml" starting at line 2041:

<variable name="BatteryLevelColorVar">
    <value condition="Integer.IsLessOrEqual(System.BatteryLevel,4)">FFEE204D</value>RED
    <value condition="Integer.IsGreater(System.BatteryLevel,4) + Integer.IsLessOrEqual(System.BatteryLevel,6)">FFCD4A4C</value>Mohogany
    <value condition="Integer.IsGreater(System.BatteryLevel,6) + Integer.IsLessOrEqual(System.BatteryLevel,10)">FFE74F00</value>Butternut Squash
    <value condition="Integer.IsGreater(System.BatteryLevel,10) + Integer.IsLessOrEqual(System.BatteryLevel,15)">FFFFCF48</value>Sunglow
    <value condition="Integer.IsGreater(System.BatteryLevel,15) + Integer.IsLessOrEqual(System.BatteryLevel,20)">FFFFFF65</value>Shooting Star
    <value condition="Integer.IsGreater(System.BatteryLevel,20) + Integer.IsLessOrEqual(System.BatteryLevel,90)">FF1CAC78</value>Green
    <value condition="Integer.IsGreater(System.BatteryLevel,90) + Integer.IsLessOrEqual(System.BatteryLevel,100)">FF76FF7A</value>ScreamingGreen
</variable>

Added one variable for Text color in "Variables.xml" starting at line 2050:

<variable name="BatteryLevelTextColorVar">
    <value condition="Integer.IsLessOrEqual(System.BatteryLevel,30)">FFF5F5F5</value>
    <value condition="Integer.IsGreater(System.BatteryLevel,30) + Integer.IsLessOrEqual(System.BatteryLevel,100)">FF000000</value>
</variable>

And now the indicator (on Android tablet 1280x800px) look like this:

Or with background on home-screen:

Try and maybe adapt this yourself, thanks again.

Danke, ich kann Kodi endlich auf meine Weise bearbeiten

Ich liebe es auch, an der Haut zu arbeiten am skin MOD v2 ... Ich kann mir nur vorstellen, wie viel Arbeit, Anpassungen, Versionen, Auflistungen, Kommunikation, Tests und Mühen darin steckten. Pfff.

Ich hoffe, dass ich auf diese Weise ein wenig helfen kann, indem ich einige meiner eigenen Anpassungen nicke, aber ich bin auch nur ein Neuling in diesem Code und dieser Struktur.

Soll/Kann ich diesen Thread jetzt löschen? Weil es im falschen Abschnitt ist?

Okay, great. My English is better and I'm serously doubting the translations when translating back to Dutch or English ... Also my translator adjusts the code when uploading thread . Noooo, no no no no no no no (pushed that f*cker away like grandma did in 'Get Out (2017)'   ).

One more addition to the Battery Indicator would be great, but I can't seem to find an answer on the Kodi wiki;

The indicator shows "Busy" when updating library (I presume), a lot. Very noticable on my, bit slower than average, Android device.

Maybe there is a way to implement text-output "Null" (or space or something) when "Busy" occurs?

The <progress> bar does this only at startup (0%), and keeps updated after first info-recieve from system, after that the bar stays updated all the time.

Zitat von beatmasterRS

You could simply use a variable and a boolean condition for that:

Code

<control type="label">
   <top>-2</top>
   <left>25</left>
   <width>50</width>
   <font>font09</font>
   <align>center</align>
   <label>$INFO[BatteryLevelVar]</label>
   <textcolor>$VAR[BatteryLevelTextColorVar]</textcolor>
 </control>

Let's check, if the System.BatteryLevel infolabel contains "%"

Code

<variable name="BatteryLevelVar">
   <value condition="String.Contains(System.BatteryLevel,%)">$INFO[System.BatteryLevel]</value>
</variable>

Best. Answer. Ever.

Edit: After testing, your answer didn't work (tried 'reload.skin()' and 'shutdown()' but no luck ).

My first guess was "$INFO" should be "$VAR" but this also didn't work.
I did test the variable by doing:

<variable name="BatteryLevelVar">
   <value>$INFO[System.BatteryLevel]</value>
</variable>

And the %-indicator shows, so in my guess the line ends up in the right variable but my condition isn't accepted? (also tried without the ",%" but still no luck)

Thanks (again).