branding changes

This commit is contained in:
2026-03-13 12:24:25 +02:00
parent 10d48043cf
commit c6e77edd89
16 changed files with 12 additions and 154 deletions

View File

@@ -1,72 +0,0 @@
# GIF Splash Screen Implementation
## Overview
This implementation adds a smooth GIF splash screen that appears after the native Android splash screen is removed. The GIF is displayed with elegant fade-in and scale animations, providing a seamless transition to the main app.
## Features
- **Smooth Animations**: Fade-in and scale animations for a polished look
- **GIF Support**: Displays the `assets/giphy.gif` file with proper frame rate
- **Error Handling**: Graceful fallback if animations fail
- **Responsive Design**: Adapts to different screen sizes
- **Clean Transition**: Smooth transition to the main app after completion
## Implementation Details
### Files Modified/Created
1. **`pubspec.yaml`**: Added `gif_view: ^0.4.0` dependency
2. **`lib/screens/splash_screen.dart`**: New splash screen widget
3. **`lib/main.dart`**: Modified to show splash screen first
### How It Works
1. **App Launch**: The app starts with the native Android splash screen
2. **Flutter Initialization**: After Flutter initializes, the GIF splash screen appears
3. **Animation Sequence**:
- Fade-in animation (1 second)
- Scale animation with elastic curve (0.8 seconds)
- GIF plays for 3 seconds
- Fade-out animation (1 second)
4. **Transition**: Smoothly transitions to the main app
### Animation Details
- **Fade Animation**: Uses `Curves.easeInOut` for smooth opacity transitions
- **Scale Animation**: Uses `Curves.elasticOut` for a bouncy, engaging effect
- **Duration**: Total splash screen duration is approximately 5 seconds
- **Frame Rate**: GIF plays at 30 FPS for smooth playback
### Customization
To customize the splash screen:
1. **Duration**: Modify the delay in `_startAnimations()` method
2. **GIF**: Replace `assets/giphy.gif` with your preferred GIF
3. **Animations**: Adjust animation curves and durations
4. **Styling**: Modify colors, shadows, and border radius
### Dependencies
- `gif_view: ^0.4.0` - For GIF playback support
## Usage
The splash screen automatically appears when the app launches. No additional configuration is required.
## Testing
The implementation has been tested with:
- ✅ Debug build compilation
- ✅ GIF asset loading
- ✅ Animation performance
- ✅ Error handling
- ✅ Responsive design
## Notes
- The GIF file must be placed in the `assets/` directory
- The splash screen respects the app's theme settings
- Animations are optimized for smooth performance
- Error handling ensures the app continues even if animations fail

View File

@@ -1,67 +0,0 @@
# Splash Screen Fix Implementation
## Issues Found and Fixed
### 1. **Missing Splash Screen Assets**
- **Problem**: The `launch_background.xml` files were referencing non-existent splash screen images
- **Fix**: Updated to use the existing `@mipmap/ic_launcher` resource
### 2. **Incorrect Night Mode Theme**
- **Problem**: Night mode theme was using `Theme.Light.NoTitleBar` instead of `Theme.Black.NoTitleBar`
- **Fix**: Updated `android/app/src/main/res/values-night/styles.xml` to use proper dark theme
### 3. **Missing Dedicated Splash Activity**
- **Problem**: No dedicated splash screen activity to handle the initial app launch
- **Fix**: Created `SplashActivity.kt` with proper timing and transition
### 4. **Incomplete Theme Configuration**
- **Problem**: Missing proper theme configuration for splash screen
- **Fix**: Added `SplashTheme` to both light and dark mode styles
## Files Created/Modified
### New Files:
1. `android/app/src/main/kotlin/com/example/qpay/SplashActivity.kt` - Dedicated splash activity
2. `android/app/src/main/res/layout/activity_splash.xml` - Splash screen layout
3. `android/app/src/main/res/values/colors.xml` - Color definitions
4. `android/app/src/main/res/values/strings.xml` - String resources
### Modified Files:
1. `android/app/src/main/AndroidManifest.xml` - Added SplashActivity as launcher
2. `android/app/src/main/res/values/styles.xml` - Added SplashTheme
3. `android/app/src/main/res/values-night/styles.xml` - Fixed dark theme and added SplashTheme
4. `android/app/src/main/res/drawable/launch_background.xml` - Fixed image reference
5. `android/app/src/main/res/drawable-v21/launch_background.xml` - Fixed image reference
6. `android/app/build.gradle.kts` - Added AppCompat dependency
7. `lib/main.dart` - Added proper Flutter initialization
## How It Works
1. **App Launch**: When the app starts, `SplashActivity` is launched first
2. **Splash Display**: Shows the app icon and name for 2 seconds
3. **Transition**: Automatically transitions to `MainActivity` (Flutter app)
4. **Theme Support**: Properly handles both light and dark mode themes
## Testing
The splash screen has been tested with:
- ✅ Debug build compilation
- ✅ Proper resource references
- ✅ Theme compatibility
- ✅ Activity transitions
## Usage
The splash screen will now automatically display when the app launches. The implementation:
- Shows for 2 seconds (configurable in `SplashActivity.kt`)
- Displays the app icon and name
- Supports both light and dark themes
- Transitions smoothly to the main Flutter app
## Customization
To customize the splash screen:
1. **Duration**: Modify the delay in `SplashActivity.kt` (currently 2000ms)
2. **Logo**: Replace `@mipmap/ic_launcher` with your custom image
3. **Colors**: Update `@color/splash_background` in `colors.xml`
4. **Layout**: Modify `activity_splash.xml` for different designs

Binary file not shown.

Before

Width:  |  Height:  |  Size: 85 KiB

After

Width:  |  Height:  |  Size: 16 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 120 KiB

After

Width:  |  Height:  |  Size: 2.2 MiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 28 KiB

After

Width:  |  Height:  |  Size: 23 KiB

View File

@@ -45,12 +45,9 @@ class _ScaffoldWithNavBarState extends State<ScaffoldWithNavBar> {
children: [
NavigationRail(
extended: true,
leading: Padding(
padding: const EdgeInsets.only(bottom: 10),
child: Image(
image: AssetImage('assets/velocity.png'),
width: 150
),
leading: Image(
image: AssetImage('assets/velocity.png'),
width: 150
),
trailing: _buildLogin(context),
labelType: NavigationRailLabelType.none,

View File

@@ -532,10 +532,10 @@ packages:
dependency: transitive
description:
name: meta
sha256: e3641ec5d63ebf0d9b41bd43201a66e3fc79a65db5f61fc181f04cd27aab950c
sha256: "23f08335362185a5ea2ad3a4e597f1375e78bce8a040df5c600c8d3552ef2394"
url: "https://pub.dev"
source: hosted
version: "1.16.0"
version: "1.17.0"
mime:
dependency: transitive
description:
@@ -857,10 +857,10 @@ packages:
dependency: transitive
description:
name: test_api
sha256: "522f00f556e73044315fa4585ec3270f1808a4b186c936e612cab0b565ff1e00"
sha256: ab2726c1a94d3176a45960b6234466ec367179b87dd74f1611adb1f3b5fb9d55
url: "https://pub.dev"
source: hosted
version: "0.7.6"
version: "0.7.7"
timeago:
dependency: "direct main"
description:

Binary file not shown.

Before

Width:  |  Height:  |  Size: 85 KiB

After

Width:  |  Height:  |  Size: 16 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 12 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 52 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 12 KiB

After

Width:  |  Height:  |  Size: 6.3 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 52 KiB

After

Width:  |  Height:  |  Size: 20 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 16 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 42 KiB

View File

@@ -26,7 +26,7 @@
<meta name="mobile-web-app-capable" content="yes">
<meta name="apple-mobile-web-app-status-bar-style" content="black">
<meta name="apple-mobile-web-app-title" content="qpay">
<link rel="apple-touch-icon" href="icons/Icon-192.png">
<link rel="apple-touch-icon" href="icons/velocity-icon-black.png">
<!-- Favicon -->
<link rel="icon" type="image/png" href="favicon.png"/>

View File

@@ -3,19 +3,19 @@
"short_name": "Velocity",
"start_url": ".",
"display": "standalone",
"background_color": "#9D6711",
"theme_color": "#9D6711",
"background_color": "#ffffff",
"theme_color": "#ffffff",
"description": "Payments... but faster",
"orientation": "portrait-primary",
"prefer_related_applications": false,
"icons": [
{
"src": "icons/Icon-192.png",
"src": "icons/velocity-icon-black-192.png",
"sizes": "192x192",
"type": "image/png"
},
{
"src": "icons/Icon-512.png",
"src": "icons/velocity-icon-black.png",
"sizes": "512x512",
"type": "image/png"
},