Overview

• File: lib/views/home_page.dart

The HomePage is a Flutter widget that serves as the main landing page of the HVC Mobile application. It provides QR code functionality for headset login, with responsive design for both landscape and portrait orientations.

Class Structure

Class Definition

class HomePage extends StatelessWidget {
  static const String routeName = '/HomePage';
  HomePage({Key? key}) : super(key: key);
}

Controllers

final AuthController authController = Get.find();

Dependencies

Required Packages

• flutter/material.dart - Core Flutter UI components
• get/get.dart - State management and routing

Internal Dependencies

• auth_controller.dart - Authentication logic
• hlk_helpers/hlk_utils.dart - Custom helper utilities
• shared/common.dart - Shared utilities
• shared/constants.dart - Application constants

UI Components

QR Code Display

Image.memory(
  authController.byteArray!,
  height: s,
  width: s,
  fit: BoxFit.contain,
)

Placeholder QR Code

Opacity(
  opacity: 0.2,
  child: GestureDetector(
    onTap: () async {
      if (!hasPermission(HvcPermissions.GenerateQRCode)) {
        HlkDialog.showErrorSnackBar('Not permitted to perform action');
        return;
      }
      await authController.getQrcode();
    },
    child: Image.asset(
      'assets/images/qrcode.png',
      height: s,
      width: s,
      fit: BoxFit.cover,
    ),
  ),
)

Instructional Text

const Text(
  'QR Code for Headset Log In',
  style: TextStyle(fontWeight: FontWeight.bold, fontSize: 18),
  textAlign: TextAlign.center,
)

Status Messages

Text(
  'Center QR code in headset camera view to scan. The QR code will remain in focus for ${duration - authController.timeSpent.value.toInt()} seconds',
  textAlign: TextAlign.center,
)

State Management

Reactive State

Obx(() => isLandscape ? Row(...) : Column(...))

Loading State

if (authController.loading.value)
  const CircularProgressIndicator(color: kAppColorPurple)

Timer State

if (authController.showTimer.value && authController.byteArray != null)
  // Show active QR code
else
  // Show placeholder QR code

QR Code Functionality

Permission Check

if (!hasPermission(HvcPermissions.GenerateQRCode)) {
  HlkDialog.showErrorSnackBar('Not permitted to perform action');
  return;
}

QR Code Generation

await authController.getQrcode();

Timer Management

final duration = getQrcodeDuration();
value: authController.timeSpent.value / duration

Responsive Design

Orientation Detection

OrientationBuilder(
  builder: (context, orientation) {
    isLandscape = orientation == Orientation.landscape;
    return Center(...)
  }
)

Landscape Layout

Row(
  children: [
    Expanded(
      child: // QR Code Section
    ),
    Expanded(
      child: Column(
        // Instructions Section
      ),
    )
  ],
)

Portrait Layout

Column(
  mainAxisAlignment: MainAxisAlignment.center,
  crossAxisAlignment: CrossAxisAlignment.center,
  children: [
    // QR Code Section
    // Instructions Section
  ],
)

Progress Indicators

Loading Indicator

if (authController.loading.value)
  const CircularProgressIndicator(color: kAppColorPurple)

Progress Bar

LinearProgressIndicator(
  value: authController.timeSpent.value / duration,
  color: kAppColorPurple,
)