Fixing the Disappearing Header in Home Assistant's Android App

Understanding the Issue

The Home Assistant Android Companion App sometimes suffers from a frustrating UI glitch where the header bar and navigation menu disappear, leaving users unable to navigate their Lovelace dashboards easily.

This issue is most frequently caused by conflicts with custom Lovelace cards, particularly those that heavily manipulate the dashboard layout, such as layout-card. When these cards are not correctly configured or are incompatible with the latest app version, they can interfere with the standard rendering of the Home Assistant UI elements.

Step-by-Step Troubleshooting Guide

Follow these steps sequentially to diagnose and resolve the disappearing header and menu issue.

1. Clearing the App Cache

The simplest fix is often clearing the application cache, which forces the app to reload all UI resources.

1. Close the Home Assistant Companion App completely.
2. Navigate to your Android device’s Settings.
3. Go to Apps (or Applications/App Manager).
4. Find and select the Home Assistant app.
5. Tap on Storage & cache.
6. Select Clear cache. Do not select “Clear storage” unless you are prepared to log back in and lose local settings.
7. Relaunch the Home Assistant Companion App.

2. Identifying Problematic Custom Cards

If clearing the cache doesn’t work, a custom card is likely the culprit. You need to isolate which card is causing the rendering failure.

Using Safe Mode

The Home Assistant Companion App offers a “Safe Mode” feature that loads the dashboard without any custom cards.

1. Open the Home Assistant Companion App.
2. Before the dashboard loads, quickly tap the three-dot menu (or equivalent) in the top right corner if it briefly appears, or use the device’s back button repeatedly until the settings screen appears.
3. Look for an option like Enter Safe Mode or Troubleshooting.
4. If the header and menu reappear in Safe Mode, you have confirmed the issue is related to a custom card.

Disabling Cards

If Safe Mode is unavailable or difficult to access, you can temporarily disable custom cards one by one in your Lovelace configuration (YAML mode) or via the UI editor until the header reappears. Start with known layout manipulators like layout-card.

3. Updating Custom Cards

Ensure all your custom cards are running the latest version. Outdated cards often contain bugs or incompatibilities with newer versions of Home Assistant or the Companion App.

Use the Home Assistant Community Store (HACS) to check for and install updates for all installed custom repositories.

4. Wrapper Card Solution

If you identify a specific card (like layout-card) that causes the issue, a common workaround is to wrap it inside another container card that handles rendering more reliably, such as custom:vertical-stack-in-card. This often resolves rendering conflicts by providing a stable container for the problematic element.

Here is an example of wrapping a layout-card to prevent the header from disappearing:

type: custom:vertical-stack-in-card
cards:
  - type: custom:layout-card
    layout: vertical
    cards:
      - type: entities
        entities:
          - entity: light.living_room
          - entity: switch.fan

By using custom:vertical-stack-in-card as the top-level card for the view, you isolate the layout manipulation performed by layout-card, often restoring the native header functionality.