Skip to content

Ux improvements #362

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
merged 3 commits into from
Mar 6, 2025
Merged

Ux improvements #362

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
3 commits
Select commit Hold shift + click to select a range
fad61f8
[UX UPDATE] Make the list item more cleaner
hossain-khan Mar 6, 2025
ea0b356
[UPDATE] Show the data source for help user isolate where the dat com…
hossain-khan Mar 6, 2025
d2cde51
[UPDATE] Alert warning icon bit bottom of main icon
hossain-khan Mar 6, 2025
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
84 changes: 49 additions & 35 deletions app/src/main/java/dev/hossain/weatheralert/ui/alertslist/CurrentAlertListScreen.kt
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -12,11 +12,13 @@ import androidx.compose.foundation.border
import androidx.compose.foundation.clickable
import androidx.compose.foundation.isSystemInDarkTheme
import androidx.compose.foundation.layout.Arrangement
import androidx.compose.foundation.layout.Box
import androidx.compose.foundation.layout.Column
import androidx.compose.foundation.layout.Row
import androidx.compose.foundation.layout.Spacer
import androidx.compose.foundation.layout.fillMaxSize
import androidx.compose.foundation.layout.fillMaxWidth
import androidx.compose.foundation.layout.height
import androidx.compose.foundation.layout.offset
import androidx.compose.foundation.layout.padding
import androidx.compose.foundation.layout.size
Expand Down Expand Up @@ -82,7 +84,6 @@ import com.slack.eithernet.exceptionOrNull
import dagger.assisted.Assisted
import dagger.assisted.AssistedFactory
import dagger.assisted.AssistedInject
import dev.hossain.weatheralert.BuildConfig
import dev.hossain.weatheralert.R
import dev.hossain.weatheralert.data.AlertTileData
import dev.hossain.weatheralert.data.WeatherRepository
Expand All @@ -97,6 +98,7 @@ import dev.hossain.weatheralert.ui.about.AboutAppScreen
import dev.hossain.weatheralert.ui.about.AppCreditsScreen
import dev.hossain.weatheralert.ui.addalert.AddNewWeatherAlertScreen
import dev.hossain.weatheralert.ui.details.WeatherAlertDetailsScreen
import dev.hossain.weatheralert.ui.serviceConfig
import dev.hossain.weatheralert.ui.settings.UserSettingsScreen
import dev.hossain.weatheralert.ui.theme.dimensions
import dev.hossain.weatheralert.util.Analytics
Expand Down Expand Up @@ -224,14 +226,7 @@ class CurrentWeatherAlertPresenter
WeatherAlertCategory.RAIN_FALL -> rainStatus > alert.alert.threshold
},
alertNote = alert.alert.notes,
forecastSourceName =
if (BuildConfig.DEBUG &&
cityForecast != null
) {
cityForecast.forecastSourceService.name
} else {
""
},
forecastSourceName = cityForecast?.forecastSourceService?.serviceConfig()?.serviceName ?: "",
),
)
}
Expand Down Expand Up @@ -631,38 +626,57 @@ fun AlertListItem(
)
}

// Show forecast source in debug builds
// Show forecast source in case user has multiple alerts from different sources.
if (data.forecastSourceName.isNotEmpty()) {
HorizontalDivider(Modifier.padding(vertical = 8.dp))
Text(
text = "Source: ${data.forecastSourceName}",
style = MaterialTheme.typography.bodySmall,
)
Row(
verticalAlignment = Alignment.CenterVertically,
modifier = Modifier.padding(vertical = 2.dp),
) {
Icon(
painter = painterResource(id = R.drawable.info_24dp),
contentDescription = null,
modifier = Modifier.size(14.dp),
tint = MaterialTheme.colorScheme.tertiary,
)
Spacer(modifier = Modifier.width(4.dp))
Text(
text = "Forecast Source: ${data.forecastSourceName}",
style = MaterialTheme.typography.bodySmall,
)
}
}
}
},
colors = colors,
leadingContent = {
Icon(
painter = painterResource(iconResId),
contentDescription = null,
tint = MaterialTheme.colorScheme.primary,
modifier = Modifier.size(48.dp),
)
},
trailingContent = {
Icon(
painter =
if (data.isAlertActive) {
painterResource(
R.drawable.warning_24dp,
)
} else {
painterResource(R.drawable.happy_face_24dp)
},
contentDescription = null,
tint = MaterialTheme.colorScheme.onSurface,
)
Box(
contentAlignment = Alignment.TopCenter,
// Increased from default size to provide more vertical space
// And push the warning icon bit more bottom
modifier = Modifier.height(56.dp),
) {
// Main category icon
Icon(
painter = painterResource(iconResId),
contentDescription = null,
tint = MaterialTheme.colorScheme.primary,
modifier = Modifier.size(48.dp),
)

// Conditionally show warning icon as an overlay when alert is active
if (data.isAlertActive) {
Icon(
painter = painterResource(R.drawable.warning_24dp),
contentDescription = "Alert active",
tint = MaterialTheme.colorScheme.error,
modifier =
Modifier
.align(Alignment.BottomEnd)
.size(20.dp), // Slightly smaller for better proportions
)
}
}
},
modifier = Modifier.padding(0.dp),
)
Expand Down Expand Up @@ -707,7 +721,7 @@ fun CurrentWeatherAlertsPreview() {
category = WeatherAlertCategory.SNOW_FALL,
threshold = "25 mm",
currentStatus = "11 mm",
isAlertActive = false,
isAlertActive = true,
alertNote = "",
forecastSourceName = "OpenWeatherMap",
),
Expand Down
9 changes: 9 additions & 0 deletions app/src/main/res/drawable/info_24dp.xml
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,9 @@
<vector xmlns:android="http://schemas.android.com/apk/res/android"
android:width="24dp"
android:height="24dp"
android:viewportWidth="960"
android:viewportHeight="960">
<path
android:pathData="M440,680h80v-240h-80v240ZM480,360q17,0 28.5,-11.5T520,320q0,-17 -11.5,-28.5T480,280q-17,0 -28.5,11.5T440,320q0,17 11.5,28.5T480,360ZM480,880q-83,0 -156,-31.5T197,763q-54,-54 -85.5,-127T80,480q0,-83 31.5,-156T197,197q54,-54 127,-85.5T480,80q83,0 156,31.5T763,197q54,54 85.5,127T880,480q0,83 -31.5,156T763,763q-54,54 -127,85.5T480,880ZM480,800q134,0 227,-93t93,-227q0,-134 -93,-227t-227,-93q-134,0 -227,93t-93,227q0,134 93,227t227,93ZM480,480Z"
android:fillColor="#e8eaed"/>
</vector>
Loading