gui : Add an option to specify a custom x-axis value for status bar items

 - The var TW_CUSTOM_CLOCK_POS, TW_CUSTOM_CPU_POS and
   TW_CUSTOM_BATTERY_POS can be used to specify a custom position
   for the clock, cpu temperature and battery percentage on the x-axis.
 - The value can either be a whole number refering to the starting
   position of that specific item on the x-axis or it can be 'left',
   'right' or 'center' which will try to automatically calculate such
   a value that items appear to be left , right or center aligned
   respectively.
 - Incase of TW_NO_CPU_TEMP being set to true, the CPU_POS var can be
   used for the TWRP version text that takes the place of the cpu temp.

 One of the use-cases of this var is when the status bar items overlap
 with the camera cutout. In that case, instead of specifiying an offset
 for the whole gui on y-axis, the status bar items can be offset along
 the x-axis only.

Signed-off-by: Yillié <yilliee@protonmail.com>
Change-Id: Ic01d301731822a598b0ca8adb2280c4d01a3622f
Signed-off-by: Mohd Faraz <androiabledroid@gmail.com>
(cherry picked from commit 09badaed48e57c3fadc63922b77e5087666a54c2)
diff --git a/gui/theme/portrait_mdpi/ui.xml b/gui/theme/portrait_mdpi/ui.xml
index 9189df0..4566dc7 100755
--- a/gui/theme/portrait_mdpi/ui.xml
+++ b/gui/theme/portrait_mdpi/ui.xml
@@ -223,6 +223,10 @@
 		<variable name="pattern_dot_dia" value="12"/>
 		<variable name="pattern_line_w" value="4"/>
 		<variable name="pattern_size" value="360"/>
+		<variable name="tw_clock_12_pos_x" value="{clock_12_pos}"/>
+		<variable name="tw_clock_24_pos_x" value="{clock_24_pos}"/>
+		<variable name="tw_cpu_pos_x" value="{cpu_pos}"/>
+		<variable name="tw_battery_pos_x" value="{battery_pos}"/>
 	</variables>
 
 	<mousecursor>
@@ -264,6 +268,7 @@
 
 			<text color="%text_color%">
 				<condition var1="tw_no_cpu_temp" var2="1"/>
+				<condition var1="tw_cpu_pos_x" var2="0"/>
 				<font resource="font_m"/>
 				<placement x="%indent%" y="%row1_header_y%"/>
 				<text>%tw_version%</text>
@@ -271,12 +276,15 @@
 
 			<text color="%text_color%">
 				<condition var1="tw_no_cpu_temp" var2="0"/>
+				<condition var1="tw_cpu_pos_x" var2="0"/>
 				<font resource="font_m"/>
 				<placement x="%indent%" y="%row1_header_y%"/>
 				<text>{@cpu_temp=CPU: %tw_cpu_temp% °C}</text>
 			</text>
 
 			<text color="%text_color%">
+				<condition var1="tw_clock_12_pos_x" var2="0"/>
+				<condition var1="tw_clock_24_pos_x" var2="0"/>
 				<font resource="font_m"/>
 				<placement x="%center_x%" y="%row1_header_y%" placement="5"/>
 				<text>%tw_time%</text>
@@ -287,12 +295,61 @@
 					<condition var1="tw_no_battery_percent" var2="0"/>
 					<condition var1="tw_battery" op="&gt;" var2="0"/>
 					<condition var1="tw_battery" op="&lt;" var2="101"/>
+					<condition var1="tw_battery_pos_x" var2="0"/>
 				</conditions>
 				<font resource="font_m"/>
 				<placement x="%indent_right%" y="%row1_header_y%" placement="1"/>
 				<text>{@battery_pct=Battery: %tw_battery%}</text>
 			</text>
 
+			<!-- Custom position for status bar items if defined START -->
+
+			<text color="%text_color%">
+				<condition var1="tw_no_cpu_temp" var2="1"/>
+				<condition var1="tw_cpu_pos_x" op="!=" var2="0"/>
+				<font resource="font_m"/>
+				<placement x="%tw_cpu_pos_x%" y="%row1_header_y%"/>
+				<text>%tw_version%</text>
+			</text>
+
+			<text color="%text_color%">
+				<condition var1="tw_no_cpu_temp" var2="0"/>
+				<condition var1="tw_cpu_pos_x" op="!=" var2="0"/>
+				<font resource="font_m"/>
+				<placement x="%tw_cpu_pos_x%" y="%row1_header_y%"/>
+				<text>{@cpu_temp=CPU: %tw_cpu_temp% °C}</text>
+			</text>
+
+			<text color="%text_color%">
+				<condition var1="tw_clock_12_pos_x" op="!=" var2="0"/>
+				<condition var1="tw_military_time" var2="0"/>
+				<font resource="font_m"/>
+				<placement x="%tw_clock_12_pos_x%" y="%row1_header_y%"/>
+				<text>%tw_time%</text>
+			</text>
+
+			<text color="%text_color%">
+				<condition var1="tw_clock_24_pos_x" op="!=" var2="0"/>
+				<condition var1="tw_military_time" var2="1"/>
+				<font resource="font_m"/>
+				<placement x="%tw_clock_24_pos_x%" y="%row1_header_y%"/>
+				<text>%tw_time%</text>
+			</text>
+
+			<text color="%text_color%">
+				<conditions>
+					<condition var1="tw_no_battery_percent" var2="0"/>
+					<condition var1="tw_battery" op="&gt;" var2="0"/>
+					<condition var1="tw_battery" op="&lt;" var2="101"/>
+					<condition var1="tw_battery_pos_x" op="!=" var2="0"/>
+				</conditions>
+				<font resource="font_m"/>
+				<placement x="%tw_battery_pos_x%" y="%row1_header_y%"/>
+				<text>{@battery_pct=Battery: %tw_battery%}</text>
+			</text>
+
+			<!-- Custom position for status bar items if defined END -->
+
 			<fill color="#000000">
 				<condition var1="tw_busy" var2="0"/>
 				<placement x="0" y="%navbar_y%" w="%screen_width%" h="%navbar_height%"/>