needanapp-design

Design-Paket von needanapp.de für Android-Apps: Theme, Darstellungs-Einstellungen und Bausteine im Material-3-Expressive-Stil. Kotlin, Jetpack Compose, Material 3, minSdk 31 (Android 12).

Lizenz: Apache 2.0. Das Paket enthält keinen Code aus GPL-Projekten; alles hier ist eigener Code.

Inhalt

Bereich	Was
theme	NeedanappTheme (Compose), NeedanappViewTheme + Theme.Needanapp (XML für Views), ThemeSettings, ThemeSettingsStore (DataStore), Bewegungs-Kurven
settings	AppearanceSettings: fertiger Bildschirm „Darstellung“ mit allen Theme-Einstellungen
components	AppScaffold (Kopfzeile mit Blur, Suche), NavigationPill, gruppierte Listen (SettingsGroup, ListRow, SwitchRow, SliderRow, SegmentedRow, ContentRow), OptionsSheet, SheetAction, EmptyState, ColorPicker
sample	Beispiel-App zum Ausprobieren aller Bausteine und Einstellungen

Darstellungs-Einstellungen

• Modus System / Hell / Dunkel, reines Schwarz (AMOLED), Helligkeit im Dunkelmodus (hellere Flächen und Karten)
• Akzentquelle: Standard (#3D63D8), Material You, eigene Farbe (Farbwähler, Hex, gespeicherte Farben), Vorlagen (Saphir, Smaragd, Bernstein, Violett, Koralle, Petrol, Limette, Rosé, Schiefer)
• Paletten-Stil: Tonal Spot, Neutral, Kräftig, Expressiv, Regenbogen, Obstsalat, Monochrom, Farbtreu, Inhalt
• Flächen-Tönung (0–2)
• Progressiver Blur, Transparenz der Pille (0–80 %), „Effekte reduzieren“ (schaltet Blur, Schatten und Übergänge ab; die System-Einstellung „Animationen entfernen“ wird ebenfalls beachtet)
• UI-Skalierung (85–115 %), Kartenecken (0–32 dp), eigene Schriftart (.ttf/.otf)
• „Nur ein Abschnitt offen“: einklappbare Abschnitte als exklusive Akkordeons
• Sprache (System oder manuell, über Androids App-Sprachen), nur bei Apps mit mehr als einer Sprache

Die Einstellungen liegen im DataStore needanapp_theme der App. Einklappbare Abschnitte starten immer eingeklappt; nur der zuletzt geöffnete Abschnitt eines Bildschirms bleibt beim nächsten Besuch offen und wird dafür ebenfalls dort gespeichert. Einklappbare Abschnitte (SettingsGroup mit id, sectionState und icon) haben als Kopf eine Zeile wie die übrigen, mit Pfeil am Ende; aufgeklappt hängen ihre Zeilen darunter. Aufeinanderfolgende Gruppen mit block = RowPosition.FIRST/MIDDLE/LAST bilden einen Block ohne großen Zwischenraum.

Einbinden

Vorerst als Gradle Composite Build (später JitPack). Beide Repos liegen nebeneinander:

// settings.gradle.kts der App
includeBuild("../needanapp-design")

// app/build.gradle.kts
dependencies {
    implementation("de.needanapp:design")
}

Compose

class MainActivity : AppCompatActivity() {
    override fun onCreate(savedInstanceState: Bundle?) {
        enableEdgeToEdge()
        super.onCreate(savedInstanceState)
        val store = ThemeSettingsStore(this)
        setContent {
            val settings by store.settings.collectAsStateWithLifecycle(initialValue = null)
            settings?.let { NeedanappTheme(it) { App(it) } }
        }
    }
}

@Composable
fun App(settings: ThemeSettings) {
    val search = rememberSearchState()
    AppScaffold(
        title = stringResource(R.string.title),
        search = search,
        bottomBar = { hazeState ->
            NavigationPill(items, selected, onSelect = { … }, hazeState = hazeState,
                modifier = Modifier.align(Alignment.BottomCenter))
        },
    ) { padding ->
        // Inhalt scrollt unter Kopfzeile und Pille: padding als contentPadding verwenden
    }
}

Der Darstellungs-Bildschirm ist ein einziger Aufruf: AppearanceSettings(settings, contentPadding = …).

Die Sample-App (sample/…/MainActivity.kt) zeigt alle Bausteine im Zusammenspiel.

Views (Übergangszeit)

Noch nicht umgestellte Bildschirme bekommen dieselben Farben:

<style name="AppTheme" parent="Theme.Needanapp" />

override fun onCreate(savedInstanceState: Bundle?) {
    NeedanappViewTheme.apply(this) // vor super.onCreate
    super.onCreate(savedInstanceState)
}

Sprachen

Gepflegt werden nur Englisch (values/, Standard) und Deutsch (values-de/). Alle Texte liegen in String-Ressourcen mit dem Präfix nd_. Apps liefern per androidResources.localeFilters += listOf("en", "de") nur diese beiden Sprachen aus. Für die Sprachauswahl sollten sie generateLocaleConfig = true setzen (siehe sample/build.gradle.kts).

Abhängigkeiten

Bibliothek	Lizenz	Zweck
AndroidX, Compose, Material 3, Material Components	Apache 2.0	Grundlage
MaterialKolor	MIT	Farbschemata aus Akzentfarbe und Paletten-Stil
Haze	Apache 2.0	Hintergrund-Blur für Kopfzeile und Pille

Bauen

./gradlew :sample:assembleDebug

Versionierung nach Semantic Versioning (DESIGN_VERSION in gradle.properties), Änderungen in CHANGELOG.md.