Skip to content

Commit 7e1ccd3

Browse files
nagarjunavsnagarjunavs
committed
feat: Enhance onboarding experience with real tap zone visualization
- Updated onboarding screens to display the actual tap zone using the real per-device AntennaMarker instead of a decorative placeholder. - Introduced a direct transition to the guided walkthrough from the final onboarding page. - Fixed scrolling issues in the Troubleshoot screen, allowing access to all content on smaller devices. - Added distinct launcher icons for debug builds, featuring a safety-orange background and a flag badge for easy identification. - Updated versionCode to 8 and versionName to 1.0.0.
1 parent f574859 commit 7e1ccd3

22 files changed

Lines changed: 320 additions & 112 deletions

File tree

‎CHANGELOG.md‎

Lines changed: 27 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -15,9 +15,36 @@ with the `0.1.0` release.
1515
without asking on the very first (possibly just curious) success. The request/launch itself is
1616
fire-and-forget per Google's guidance (the API never reports whether the dialog was shown or
1717
reviewed), and Google's own quota is still the final word on whether it actually appears.
18+
- Sample app: the onboarding walkthrough's 3 pages now render the same real, per-device antenna
19+
marker every other screen uses (`AntennaMarker`), instead of a decorative fixed-position pulsing
20+
dot with no connection to the actual device - the now-unused `MarkerOverlay` composable was
21+
removed along with it. The final page's primary button ("Try the guided walkthrough") now hands
22+
off directly into the existing Tap Guide → Tap Test flow instead of landing on Home, reusing the
23+
already-built guided walkthrough rather than duplicating a second one; Skip is unchanged.
24+
- Sample app: debug builds now also get a visually distinct **launcher icon** - bold safety-orange
25+
background, the same TapSense ring mark recolored dark for contrast, and a small "flag" badge -
26+
on top of the existing "TapSense Debug" label/`-debug` version suffix. The badge is included on
27+
the Android 13+ themed-icon (monochrome) layer too, since that layer discards all authored color
28+
at runtime, so shape is the only thing that can differentiate it there; it's positioned inside
29+
the ~66dp guaranteed adaptive-icon safe zone so it survives every mask shape. Verified byte-level
30+
via `aapt2 dump xmltree`/`dump resources` on built debug and release APKs that the release icon's
31+
compiled background/foreground/monochrome resources are unchanged.
1832

1933
### Fixed
2034

35+
- Sample app: the Troubleshoot screen ("Help center" in Settings) had no way to scroll. Its
36+
content `Column` had no scroll modifier, and nested a `LazyColumn` (its own independently
37+
scrolling region) with no height constraint, so the list silently claimed all remaining vertical
38+
space; the contextual actions panel that appears below it once an issue is selected was laid out
39+
*after* that already-maxed-out region. Since the outer `Column` never scrolled and the
40+
`LazyColumn`'s own scrolling only moved its own list items, nothing could bring that panel (or
41+
the tail of the issue list itself) into view once combined content exceeded the screen height -
42+
present since the app's first commit, on any small enough device or large enough font scale.
43+
Fixed by making the whole content `Column` scrollable and replacing the `LazyColumn` with a
44+
plain `Column` iterating the six static issues directly - a fixed 6-item list never needed
45+
`LazyColumn`'s recycling, and it was the thing creating the second, conflicting scroll region in
46+
the first place.
47+
2148
- Sample app: changing the app's language via **Settings → Apps → TapSense → Language** (the
2249
Android 13+ per-app language picker, wired by `android:localeConfig`/`locales_config.xml`)
2350
had no effect in the Play-installed release build (versionCode 5), while the same switch

‎app/build.gradle.kts‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -27,7 +27,7 @@ android {
2727
applicationId = "com.tapsense.app"
2828
minSdk = 26
2929
targetSdk = 36
30-
versionCode = 7
30+
versionCode = 8
3131
versionName = "1.0.0"
3232

3333
testInstrumentationRunner = "com.tapsense.app.HiltTestRunner"

‎app/src/debug/res/drawable/ic_launcher_background.xml‎

Lines changed: 20 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,20 @@
1+
<?xml version="1.0" encoding="utf-8"?>
2+
<!--
3+
Debug-only launcher icon background (Gradle resource-merging precedence: this src/debug/res
4+
file replaces app/src/main/res/drawable/ic_launcher_background.xml for the debug build variant
5+
only - `debug` overlays `main`, never the reverse, so `assembleRelease`/`bundleRelease` still
6+
resolve @drawable/ic_launcher_background to the original main/ version unchanged. Bold, solid
7+
safety-orange in place of the release icon's dark charcoal - a background-color change survives
8+
every adaptive-icon mask shape unmodified (unlike foreground content near the edges, which some
9+
launchers clip differently), so it's the single most reliable "this is not the production icon"
10+
signal at a glance. See CHECKLIST.md's "Debug builds are visually distinguishable" note.
11+
-->
12+
<vector xmlns:android="http://schemas.android.com/apk/res/android"
13+
android:width="108dp"
14+
android:height="108dp"
15+
android:viewportWidth="108"
16+
android:viewportHeight="108">
17+
<path
18+
android:fillColor="#FF6D00"
19+
android:pathData="M0,0h108v108h-108z" />
20+
</vector>

‎app/src/debug/res/drawable/ic_launcher_foreground.xml‎

Lines changed: 34 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,34 @@
1+
<?xml version="1.0" encoding="utf-8"?>
2+
<!--
3+
Debug-only launcher icon foreground - overlays app/src/main/res/drawable/ic_launcher_foreground.xml
4+
for the debug variant only (see ic_launcher_background.xml in this same directory for the
5+
source-set precedence explanation). Same TapSense ring-and-dot mark and geometry as the release
6+
icon, kept recognizable, but recolored dark (instead of aqua) for contrast against the debug-only
7+
orange background, plus one small diamond "flag" badge at (74,74) - chosen because it sits well
8+
inside the ~66dp-diameter guaranteed-safe-zone circle centered on (54,54) (distance ≈28.3dp,
9+
under the 33dp safe radius), so it renders intact under every adaptive-icon mask shape (circle,
10+
squircle, rounded square, teardrop) instead of risking inconsistent edge clipping.
11+
-->
12+
<vector xmlns:android="http://schemas.android.com/apk/res/android"
13+
android:width="108dp"
14+
android:height="108dp"
15+
android:viewportWidth="108"
16+
android:viewportHeight="108">
17+
<path
18+
android:fillColor="#00000000"
19+
android:strokeColor="#211F1C"
20+
android:strokeWidth="4"
21+
android:pathData="M81,54 A27,27 0 1,1 27,54 A27,27 0 1,1 81,54 Z" />
22+
<path
23+
android:fillColor="#00000000"
24+
android:strokeColor="#211F1C"
25+
android:strokeWidth="4"
26+
android:pathData="M70,54 A16,16 0 1,1 38,54 A16,16 0 1,1 70,54 Z" />
27+
<path
28+
android:fillColor="#211F1C"
29+
android:pathData="M60,54 A6,6 0 1,1 48,54 A6,6 0 1,1 60,54 Z" />
30+
<!-- Debug flag badge - not present in the release icon. -->
31+
<path
32+
android:fillColor="#211F1C"
33+
android:pathData="M74,68 L80,74 L74,80 L68,74 Z" />
34+
</vector>

‎app/src/debug/res/drawable/ic_launcher_monochrome.xml‎

Lines changed: 34 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,34 @@
1+
<?xml version="1.0" encoding="utf-8"?>
2+
<!--
3+
Debug-only themed-icon (Android 13+ "themed icons") layer - overlays
4+
app/src/main/res/drawable/ic_launcher_monochrome.xml for the debug variant only (see
5+
ic_launcher_background.xml in this same directory for the source-set precedence explanation).
6+
The system strips all authored color from this layer and tints it with the user's chosen theme
7+
color, so background/foreground color changes can't differentiate debug from release here -
8+
only shape can. Same ring-and-dot mark as release's monochrome layer, plus the same small
9+
diamond "flag" badge used in ic_launcher_foreground.xml, so a debug build stays visually
10+
distinguishable even for users who have themed icons enabled, not just on the standard icon.
11+
-->
12+
<vector xmlns:android="http://schemas.android.com/apk/res/android"
13+
android:width="108dp"
14+
android:height="108dp"
15+
android:viewportWidth="108"
16+
android:viewportHeight="108">
17+
<path
18+
android:fillColor="#00000000"
19+
android:strokeColor="#FF000000"
20+
android:strokeWidth="4"
21+
android:pathData="M81,54 A27,27 0 1,1 27,54 A27,27 0 1,1 81,54 Z" />
22+
<path
23+
android:fillColor="#00000000"
24+
android:strokeColor="#FF000000"
25+
android:strokeWidth="4"
26+
android:pathData="M70,54 A16,16 0 1,1 38,54 A16,16 0 1,1 70,54 Z" />
27+
<path
28+
android:fillColor="#FF000000"
29+
android:pathData="M60,54 A6,6 0 1,1 48,54 A6,6 0 1,1 60,54 Z" />
30+
<!-- Debug flag badge - not present in the release icon. -->
31+
<path
32+
android:fillColor="#FF000000"
33+
android:pathData="M74,68 L80,74 L74,80 L68,74 Z" />
34+
</vector>

‎app/src/main/kotlin/com/tapsense/app/ui/component/DeviceIllustrations.kt‎

Lines changed: 3 additions & 36 deletions
Original file line numberDiff line numberDiff line change
@@ -1,25 +1,20 @@
11
package com.tapsense.app.ui.component
22

33
import androidx.compose.foundation.Canvas
4-
import androidx.compose.foundation.layout.Box
5-
import androidx.compose.foundation.layout.fillMaxSize
64
import androidx.compose.runtime.Composable
7-
import androidx.compose.ui.Alignment
8-
import androidx.compose.ui.BiasAlignment
95
import androidx.compose.ui.Modifier
106
import androidx.compose.ui.geometry.CornerRadius
117
import androidx.compose.ui.geometry.Offset
128
import androidx.compose.ui.geometry.Size
139
import androidx.compose.ui.graphics.Color
1410
import androidx.compose.ui.graphics.drawscope.Stroke
15-
import androidx.compose.ui.unit.Dp
1611
import androidx.compose.ui.unit.dp
1712

1813
/**
1914
* A plain solid-filled phone silhouette for decorative (non-data-driven) contexts - My Phone's
20-
* Front tab and (before any device is resolved) the Onboarding walkthrough, so it has no real
21-
* [com.nfclocator.core.domain.model.NormalizedRect] antenna zone to draw `nfc-locator-core`'s
22-
* `AntennaSilhouette` against.
15+
* Front tab, which has no real [com.nfclocator.core.domain.model.NormalizedRect] antenna zone to
16+
* draw `nfc-locator-core`'s `AntennaSilhouette` against (unlike the Back tab, and unlike
17+
* Onboarding, which now shows the real per-device `AntennaMarker`).
2318
*
2419
* [cameraBump] draws a top-left corner camera-module square, matching a device's *back* panel
2520
* (see My Phone's Back tab). [screenInset] draws an inset "screen" rectangle with a top-center
@@ -91,31 +86,3 @@ fun ReaderDeviceIllustration(outerColor: Color, innerColor: Color, modifier: Mod
9186
drawCircle(color = innerColor, radius = size.minDimension * 0.31f, center = center)
9287
}
9388
}
94-
95-
/**
96-
* Overlays a pulsing [TapSenseLogo] ripple marker at a fractional position within [content] -
97-
* used to place the "here's where you'd tap" indicator on the Onboarding illustrations, whose
98-
* phone has no real antenna-zone data to position a marker from.
99-
*/
100-
@Composable
101-
fun MarkerOverlay(
102-
markerColor: Color,
103-
horizontalBias: Float,
104-
verticalBias: Float,
105-
markerSize: Dp,
106-
reducedMotion: Boolean,
107-
modifier: Modifier = Modifier,
108-
content: @Composable () -> Unit,
109-
) {
110-
Box(modifier = modifier.fillMaxSize()) {
111-
content()
112-
TapSenseLogo(
113-
color = markerColor,
114-
size = markerSize,
115-
pulsing = true,
116-
reducedMotion = reducedMotion,
117-
singleRing = true,
118-
modifier = Modifier.align(BiasAlignment(horizontalBias, verticalBias)),
119-
)
120-
}
121-
}

‎app/src/main/kotlin/com/tapsense/app/ui/navigation/TapSenseNavHost.kt‎

Lines changed: 6 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -92,6 +92,12 @@ fun TapSenseNavHost(
9292
popUpTo(TapSenseDestinations.ONBOARDING) { inclusive = true }
9393
}
9494
},
95+
onStartGuidedWalkthrough = {
96+
navController.navigate(TapSenseDestinations.HOME) {
97+
popUpTo(TapSenseDestinations.ONBOARDING) { inclusive = true }
98+
}
99+
navController.navigate(TapSenseDestinations.TAP_GUIDE)
100+
},
95101
onChooseDifferentPhone = {
96102
navController.navigate(TapSenseDestinations.PHONE_SELECTION)
97103
},

0 commit comments

Comments
 (0)