Skip to content

Enhance splash screen #68

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
Jul 29, 2025
Merged

Enhance splash screen #68

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
6f309a9
refactor(app): reorganize splash screen remover files and update imports
fulleni Jul 29, 2025
490cda3
feat(web): improve splash screen and app environment
fulleni Jul 29, 2025
4c8313d
feat(icon): update app and web icons
fulleni Jul 29, 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
Binary file modified android/app/src/main/res/mipmap-hdpi/launcher_icon.png
View file
Open in desktop
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file modified android/app/src/main/res/mipmap-mdpi/launcher_icon.png
View file
Open in desktop
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file modified android/app/src/main/res/mipmap-xhdpi/launcher_icon.png
View file
Open in desktop
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file modified android/app/src/main/res/mipmap-xxhdpi/launcher_icon.png
View file
Open in desktop
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file modified android/app/src/main/res/mipmap-xxxhdpi/launcher_icon.png
View file
Open in desktop
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
15 changes: 5 additions & 10 deletions flutter_launcher_icons.yaml
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,22 +1,17 @@
# flutter pub run flutter_launcher_icons
flutter_launcher_icons:
image_path: "assets/icon/headlines_toolkit.png"
image_path: "assets/icon/logo.png"

android: "launcher_icon"
# image_path_android: "assets/icon/headlines_toolkit.png"
# image_path_android: "assets/icon/logo.png"
min_sdk_android: 21 # android min sdk min:16, default 21
# adaptive_icon_background: "assets/icon/background.png"
# adaptive_icon_foreground: "assets/icon/foreground.png"
# adaptive_icon_foreground_inset: 16
# adaptive_icon_monochrome: "assets/icon/monochrome.png"

ios: false
# image_path_ios: "assets/icon/headlines_toolkit.png"
remove_alpha_channel_ios: true
# image_path_ios_dark_transparent: "assets/icon/icon_dark.png"
# image_path_ios_tinted_grayscale: "assets/icon/icon_tinted.png"
# desaturate_tinted_to_grayscale_ios: true
Comment on lines 11 to -16
Copy link

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

high

Removing this ios configuration block will cause the flutter_launcher_icons tool to default to generating icons for iOS (as ios defaults to true). This is a significant change from explicitly disabling it with ios: false. Was this intentional? If not, this could introduce unexpected changes or failures in the iOS build process.

If you intend to keep iOS icon generation disabled, this block should be restored, or at least ios: false should be present in the configuration.


web:
generate: true
# image_path: "assets/icon/headlines_toolkit.png"
background_color: "#FFFFFF"
theme_color: "#FFFFFF"
theme_color: "#FFFFFF"
0 lib/app/services/splash_remover_stub.dart → ...h_screen_remover/splash_remover_stub.dart
View file
Open in desktop
File renamed without changes.
0 lib/app/services/splash_remover_web.dart → ...sh_screen_remover/splash_remover_web.dart
View file
Open in desktop
File renamed without changes.
0 lib/app/services/web_splash.dart → ...sh_screen_remover/web_splash_remover.dart
View file
Open in desktop
File renamed without changes.
4 changes: 2 additions & 2 deletions lib/main.dart
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,12 +1,12 @@
import 'package:device_preview/device_preview.dart';
import 'package:flutter_news_app_mobile_client_full_source_code/app/services/web_splash.dart';
import 'package:flutter/foundation.dart';
import 'package:flutter/material.dart';
import 'package:flutter_news_app_mobile_client_full_source_code/app/config/config.dart';
import 'package:flutter_news_app_mobile_client_full_source_code/app/services/splash_screen_remover/web_splash_remover.dart';
import 'package:flutter_news_app_mobile_client_full_source_code/bootstrap.dart';

// Define the current application environment (production/development/demo).
const appEnvironment = AppEnvironment.development;
const appEnvironment = AppEnvironment.demo;
Copy link

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

high

The application environment has been switched to demo. While this is likely for development and testing this feature, it should be reverted to the appropriate environment (e.g., development) before this pull request is merged. Merging this change could lead to deploying the wrong application variant.

const appEnvironment = AppEnvironment.development;


void main() async {
final appConfig = switch (appEnvironment) {
Expand Down
Binary file modified web/favicon.png
View file
Open in desktop
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file modified web/icons/Icon-192.png
View file
Open in desktop
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file modified web/icons/Icon-512.png
View file
Open in desktop
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file modified web/icons/Icon-maskable-192.png
View file
Open in desktop
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file modified web/icons/Icon-maskable-512.png
View file
Open in desktop
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
20 changes: 10 additions & 10 deletions web/index.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -29,6 +29,7 @@

<title>Flutter News App</title>
<link rel="manifest" href="manifest.json">
<link rel="stylesheet" type="text/css" href="splash/splash.css">


<meta content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" name="viewport">
Expand Down Expand Up @@ -98,25 +99,24 @@
</style>
<script id="splash-screen-script">
function removeSplashFromWeb() {
document.getElementById("splash")?.remove();
document.getElementById("splash-branding")?.remove();
document.getElementById("splash-container")?.remove();
document.body.style.background = "transparent";
}
</script>
</head>
<body>
<picture id="splash">
<source srcset="splash/img/light-1x.png 1x, splash/img/light-2x.png 2x, splash/img/light-3x.png 3x, splash/img/light-4x.png 4x" media="(prefers-color-scheme: light)">
<source srcset="splash/img/dark-1x.png 1x, splash/img/dark-2x.png 2x, splash/img/dark-3x.png 3x, splash/img/dark-4x.png 4x" media="(prefers-color-scheme: dark)">
<img class="center" aria-hidden="true" src="splash/img/light-1x.png" alt="">
</picture>
<div id="loading-indicator">
<div class="spinner"></div>
<div id="splash-container" class="center">
<picture id="splash">
<source srcset="splash/img/light-1x.png 1x, splash/img/light-2x.png 2x, splash/img/light-3x.png 3x, splash/img/light-4x.png 4x" media="(prefers-color-scheme: light)">
<source srcset="splash/img/dark-1x.png 1x, splash/img/dark-2x.png 2x, splash/img/dark-3x.png 3x, splash/img/dark-4x.png 4x" media="(prefers-color-scheme: dark)">
<img aria-hidden="true" src="splash/img/light-1x.png" alt="">
</picture>
<div class="loader"></div>
</div>
<script>
{{flutter_bootstrap_js}}
</script>



</body></html>
</body></html>
46 changes: 46 additions & 0 deletions web/splash/splash.css
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,46 @@
.center {
margin: 0;
position: absolute;
top: 50%;
left: 50%;
-ms-transform: translate(-50%, -50%);
transform: translate(-50%, -50%);
}
Comment on lines +1 to +8
Copy link

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

medium

This .center class is a duplicate of a class with the same name and properties defined inside a <style> tag in web/index.html (lines 48-55). To improve maintainability and avoid redundancy, please remove the duplicated style from index.html. Having a single source of truth for styles makes the code easier to manage.


#splash-container {
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
}

#splash {
margin-bottom: 20px;
}

.loader {
border: 4px solid #f3f3f3;
border-radius: 50%;
border-top: 4px solid #3498db;
width: 40px;
height: 40px;
-webkit-animation: spin 2s linear infinite; /* Safari */
animation: spin 2s linear infinite;
}

/* Safari */
@-webkit-keyframes spin {
0% { -webkit-transform: rotate(0deg); }
100% { -webkit-transform: rotate(360deg); }
}

@keyframes spin {
0% { transform: rotate(0deg); }
100% { transform: rotate(360deg); }
}

@media (prefers-color-scheme: dark) {
.loader {
border-top: 4px solid #90caf9; /* A lighter blue for dark mode */
}
}
Loading