App 2.27.0: full-width Overview, a button hides the navigation

A small button in the Overview's top-right corner hides the app's
sidebar (or bottom bar) and brings it back; only on the Overview,
remembered, swiping still works. Emulator only.

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_01LhzAVaUyqcw5PkGjz4mWW6

app/build.gradle

@@ -34,8 +34,8 @@ android {
         applicationId "com.stinnesbeck.nilsmg4"
         minSdk 27
         targetSdk 36
-        versionCode 120
-        versionName "2.26.0"
+        versionCode 121
+        versionName "2.27.0"
 
         // Nothing about the server ships in the APK: its URL and ingest token are entered in
         // the app's Server tab (ServerConfig), and the database is only reachable by the server.

app/src/main/java/com/evsuite/abrp/MainActivity.java

@@ -182,7 +182,14 @@ public class MainActivity extends AppCompatActivity {
         // by the tick even when their page is off screen.
         pager.setOffscreenPageLimit(panes.length - 1);
         pager.registerOnPageChangeCallback(new ViewPager2.OnPageChangeCallback() {
-            @Override public void onPageSelected(int position) { markCurrentPage(position); }
+            @Override public void onPageSelected(int position) {
+                markCurrentPage(position);
+                applyOverviewFullScreen(position);
+            }
+        });
+        findViewById(R.id.overview_fullscreen).setOnClickListener(v -> {
+            prefs.edit().putBoolean(PREF_OVERVIEW_FULLSCREEN, !prefs.getBoolean(PREF_OVERVIEW_FULLSCREEN, false)).apply();
+            applyOverviewFullScreen(pager.getCurrentItem());
         });
 
         for (int i = 0; i < TAB_IDS.length; i++) {
@@ -192,6 +199,25 @@ public class MainActivity extends AppCompatActivity {
             findViewById(TAB_IDS[i]).setOnClickListener(v -> pager.setCurrentItem(index, false));
         }
         markCurrentPage(pager.getCurrentItem());
+        applyOverviewFullScreen(pager.getCurrentItem());
+    }
+
+    /** Whether the Overview hides the navigation (the button in its corner). */
+    static final String PREF_OVERVIEW_FULLSCREEN = "overview_fullscreen";
+
+    /**
+     * The Overview full screen: the navigation hidden while the Overview is the page and the
+     * driver chose it; every other page always has its navigation, and swiping still works.
+     * The button only shows on the Overview, its icon saying what a tap does.
+     */
+    private void applyOverviewFullScreen(int position) {
+        boolean overview = position == 0;
+        boolean full = overview && prefs.getBoolean(PREF_OVERVIEW_FULLSCREEN, false);
+        findViewById(R.id.nav_bar).setVisibility(full ? View.GONE : View.VISIBLE);
+        android.widget.ImageButton button = findViewById(R.id.overview_fullscreen);
+        button.setVisibility(overview ? View.VISIBLE : View.GONE);
+        button.setImageResource(full ? R.drawable.ic_fullscreen_exit : R.drawable.ic_fullscreen);
+        button.setContentDescription(getString(full ? R.string.overview_fullscreen_exit : R.string.overview_fullscreen_enter));
     }
 
     /**

app/src/main/java/com/evsuite/abrp/MinimalView.java

@@ -67,7 +67,8 @@ final class MinimalView extends ClusterCanvasView {
 
         // Corners: power and the clock; bottom middle: usage.
         text(c, fmt(v.powerKw, "%.1f kW", "— kW"), 8f * dp, 30f * dp, 20f * dp, grey, Paint.Align.LEFT);
-        text(c, v.clock.isEmpty() ? "—" : v.clock, w - 8f * dp, 30f * dp, 20f * dp, grey, Paint.Align.RIGHT);
+        // Left of the full-screen button, which sits in the top-right corner.
+        text(c, v.clock.isEmpty() ? "—" : v.clock, w - 72f * dp, 30f * dp, 20f * dp, grey, Paint.Align.RIGHT);
         text(c, fmt(v.usage5Min, "%.1f kWh/100 km", "— kWh/100 km"), w / 2f, h * 0.86f, 16f * dp, grey, Paint.Align.CENTER);
 
         // The battery: a hairline along the bottom, filled to the charge.

app/src/main/java/com/evsuite/abrp/TerminalView.java

@@ -41,9 +41,10 @@ final class TerminalView extends ClusterCanvasView {
 
         // About 14 rows at 1.32 em each plus margins; monospace is about 0.6 em wide and the
         // longest row about 58 characters.
-        float size = Math.min(h / 19.5f, w / 38f);
+        float x = 16f * dp;
+        float size = Math.min(h / 19.5f, (w - x) / 38f);
         text.setTextSize(size);
-        float line = size * 1.32f, x = 16f * dp, y = 12f * dp + line;
+        float line = size * 1.32f, y = 12f * dp + line;
         String gear = gearRow();
 
         print(c, "nils@mg4:~$ watch -n 0.2 vehicle-status", x, y, dim);

app/src/main/res/drawable/bg_fullscreen_button.xml

@@ -0,0 +1,8 @@
+<?xml version="1.0" encoding="utf-8"?>
+<!-- The full-screen button: a small dark disc inside its 72 dp touch area. -->
+<inset xmlns:android="http://schemas.android.com/apk/res/android" android:inset="16dp">
+    <shape android:shape="oval">
+        <solid android:color="#99121212" />
+        <stroke android:width="1dp" android:color="@color/ev_outline" />
+    </shape>
+</inset>

app/src/main/res/drawable/ic_fullscreen.xml

@@ -0,0 +1,11 @@
+<?xml version="1.0" encoding="utf-8"?>
+<!-- Expand, for the Overview's full-screen button (hides the navigation). -->
+<vector xmlns:android="http://schemas.android.com/apk/res/android"
+    android:width="24dp"
+    android:height="24dp"
+    android:viewportWidth="24"
+    android:viewportHeight="24">
+    <path
+        android:fillColor="@color/ev_text_primary"
+        android:pathData="M7,14H5v5h5v-2H7v-3zM5,10h2V7h3V5H5v5zM17,17h-3v2h5v-5h-2v3zM14,5v2h3v3h2V5h-5z" />
+</vector>

app/src/main/res/drawable/ic_fullscreen_exit.xml

@@ -0,0 +1,11 @@
+<?xml version="1.0" encoding="utf-8"?>
+<!-- Shrink, for the Overview's full-screen button (brings the navigation back). -->
+<vector xmlns:android="http://schemas.android.com/apk/res/android"
+    android:width="24dp"
+    android:height="24dp"
+    android:viewportWidth="24"
+    android:viewportHeight="24">
+    <path
+        android:fillColor="@color/ev_text_primary"
+        android:pathData="M5,16h3v3h2v-5H5v2zM8,8H5v2h5V5H8v3zM14,19h2v-3h3v-2h-5v5zM16,8V5h-2v5h5V8h-3z" />
+</vector>

app/src/main/res/layout-w1000dp/activity_main.xml

@@ -2,7 +2,7 @@
 <FrameLayout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:app="http://schemas.android.com/apk/res-auto" android:id="@+id/app_root" android:layout_width="match_parent" android:layout_height="match_parent" android:fitsSystemWindows="true" android:background="@color/ev_background">
     <com.evsuite.abrp.PremiumBackdropView android:layout_width="match_parent" android:layout_height="match_parent" />
     <LinearLayout android:layout_width="match_parent" android:layout_height="match_parent" android:orientation="horizontal">
-        <ScrollView android:layout_width="192dp" android:layout_height="match_parent" android:layout_margin="16dp" android:fillViewport="true" android:background="@drawable/bg_sidebar" android:scrollbars="none">
+        <ScrollView android:id="@+id/nav_bar" android:layout_width="192dp" android:layout_height="match_parent" android:layout_margin="16dp" android:fillViewport="true" android:background="@drawable/bg_sidebar" android:scrollbars="none">
             <LinearLayout android:layout_width="match_parent" android:layout_height="wrap_content" android:orientation="vertical" android:padding="12dp">
                 <TextView android:layout_width="match_parent" android:layout_height="wrap_content" android:text="@string/design_brand" android:textAppearance="@style/Text.EV.Hero" android:textColor="?attr/evAccent" android:paddingStart="14dp" android:paddingTop="8dp" />
                 <TextView android:layout_width="match_parent" android:layout_height="wrap_content" android:text="@string/design_brand_caption" android:textAppearance="@style/Text.EV.Secondary" android:paddingStart="14dp" android:layout_marginBottom="24dp" />
@@ -16,7 +16,11 @@
             </LinearLayout>
         </ScrollView>
         <LinearLayout android:layout_width="0dp" android:layout_weight="1" android:layout_height="match_parent" android:orientation="vertical">
-            <androidx.viewpager2.widget.ViewPager2 android:id="@+id/content" android:layout_width="match_parent" android:layout_height="0dp" android:layout_weight="1" />
+            <!-- The pages, and over them on the Overview the button that hides the navigation. -->
+            <FrameLayout android:layout_width="match_parent" android:layout_height="0dp" android:layout_weight="1">
+                <androidx.viewpager2.widget.ViewPager2 android:id="@+id/content" android:layout_width="match_parent" android:layout_height="match_parent" />
+                <ImageButton android:id="@+id/overview_fullscreen" android:layout_width="72dp" android:layout_height="72dp" android:layout_gravity="top|end" android:background="@drawable/bg_fullscreen_button" android:src="@drawable/ic_fullscreen" android:padding="24dp" android:scaleType="fitCenter" android:alpha="0.75" android:contentDescription="@string/overview_fullscreen_enter" />
+            </FrameLayout>
         </LinearLayout>
     </LinearLayout>
 </FrameLayout>

app/src/main/res/layout/activity_main.xml

@@ -2,8 +2,12 @@
 <FrameLayout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:app="http://schemas.android.com/apk/res-auto" android:id="@+id/app_root" android:layout_width="match_parent" android:layout_height="match_parent" android:fitsSystemWindows="true" android:background="@color/ev_background">
   <com.evsuite.abrp.PremiumBackdropView android:layout_width="match_parent" android:layout_height="match_parent"/>
   <LinearLayout android:layout_width="match_parent" android:layout_height="match_parent" android:orientation="vertical">
-    <androidx.viewpager2.widget.ViewPager2 android:id="@+id/content" android:layout_width="match_parent" android:layout_height="0dp" android:layout_weight="1"/>
-    <LinearLayout android:layout_width="match_parent" android:layout_height="wrap_content" android:orientation="horizontal" android:padding="8dp" android:background="@drawable/bg_sidebar">
+    <!-- The pages, and over them on the Overview the button that hides the navigation. -->
+    <FrameLayout android:layout_width="match_parent" android:layout_height="0dp" android:layout_weight="1">
+      <androidx.viewpager2.widget.ViewPager2 android:id="@+id/content" android:layout_width="match_parent" android:layout_height="match_parent"/>
+      <ImageButton android:id="@+id/overview_fullscreen" android:layout_width="72dp" android:layout_height="72dp" android:layout_gravity="top|end" android:background="@drawable/bg_fullscreen_button" android:src="@drawable/ic_fullscreen" android:padding="24dp" android:scaleType="fitCenter" android:alpha="0.75" android:contentDescription="@string/overview_fullscreen_enter" />
+    </FrameLayout>
+    <LinearLayout android:id="@+id/nav_bar" android:layout_width="match_parent" android:layout_height="wrap_content" android:orientation="horizontal" android:padding="8dp" android:background="@drawable/bg_sidebar">
       <com.google.android.material.button.MaterialButton android:id="@+id/tabVehicle" style="@style/Widget.EV.NavTab.Compact" android:layout_width="0dp" android:layout_height="76dp" android:layout_weight="1" android:text="@string/tab_vehicle" app:icon="@drawable/ic_tab_vehicle"/>
       <com.google.android.material.button.MaterialButton android:id="@+id/tabConsumption" style="@style/Widget.EV.NavTab.Compact" android:layout_width="0dp" android:layout_height="76dp" android:layout_weight="1" android:text="@string/tab_consumption" app:icon="@drawable/ic_tab_vehicle"/>
       <com.google.android.material.button.MaterialButton android:id="@+id/tabCharging" style="@style/Widget.EV.NavTab.Compact" android:layout_width="0dp" android:layout_height="76dp" android:layout_weight="1" android:text="@string/tab_charging" app:icon="@drawable/ic_tab_charging"/>

app/src/main/res/values/strings.xml

@@ -131,6 +131,8 @@
     <string name="overview_style_cartoon">Cartoon</string>
     <string name="overview_style_blueprint">Blueprint</string>
     <string name="overview_style_mg">MG</string>
+    <string name="overview_fullscreen_enter">Overview full screen: hide the navigation</string>
+    <string name="overview_fullscreen_exit">Show the navigation again</string>
     <string name="overview_style_minimal">Minimal</string>
     <string name="overview_style_terminal">Terminal</string>
     <string name="overview_style_aviation">Aviation</string>