Skip to main content
This is a planned feature that has not yet been implemented. The UI elements exist in the app, but the scanning and attendance functionality is not yet active.
The QR Attendance feature is designed to allow students to quickly check in to classes by scanning QR codes displayed by professors or posted in classrooms.

​
Current Implementation

The app includes a Floating Action Button (FAB) for the QR scanner on the Home Screen:
HomeScreen.kt:42-54
Scaffold(
    floatingActionButton = {
        FloatingActionButton(
            onClick = { },
            containerColor = TecGold,
            contentColor = TecBlue
        ) {
            Icon(
                imageVector = Icons.Default.QrCodeScanner,
                contentDescription = "Escanear QR"
            )
        }
    },
    containerColor = Color(0xFFF5F6F8)
) { innerPadding ->

​
Visual Design

Button Styling

  • Background: TecGold (brand accent color)
  • Icon: TecBlue QR scanner icon
  • Position: Bottom-right corner as floating action button

Icon

Uses Material Icons’ QrCodeScanner icon to clearly indicate the button’s purpose

​
Current State

The FAB is visible on the Home Screen but has no functionality:
  • onClick: Empty handler (no action)
  • Visual: Fully styled and positioned
  • Accessibility: Content description “Escanear QR” (Scan QR)

​
Intended Functionality

When implemented, the QR Attendance feature will:

​
1. QR Code Scanner

Camera Integration

Open the device camera with a QR code scanner overlay when the FAB is tapped

​
2. Attendance Registration

Scan & Verify

  • Scan QR code displayed by professor
  • Verify class session and time
  • Validate student enrollment

Record Attendance

  • Submit attendance record to backend
  • Display confirmation message
  • Update attendance status in app

​
3. Use Cases

Class Check-in

Students scan a QR code when entering the classroom to mark attendance

Professor Display

Professors display a unique QR code for each class session

Time-Limited

QR codes expire after a certain time to prevent fraudulent check-ins

​
Technical Implementation Plan

To implement this feature, the following components would be needed:

​
Required Permissions

AndroidManifest.xml
<uses-permission android:name="android.permission.CAMERA" />
<uses-feature android:name="android.hardware.camera" />
<uses-feature android:name="android.hardware.camera.autofocus" />

​
QR Code Scanner Library

Potential libraries to integrate:

ML Kit Barcode Scanning

Google’s ML Kit provides built-in barcode/QR scanning with good performance

ZXing

Popular open-source library for QR code scanning and generation

​
Data Model

A potential AttendanceRecord data class: 
data class AttendanceRecord(
    val id: Int,
    val studentId: Int,
    val classSessionId: Int,
    val timestamp: Long,
    val method: AttendanceMethod, // QR, MANUAL, etc.
    val status: AttendanceStatus  // PRESENT, LATE, ABSENT
)

enum class AttendanceMethod {
    QR_SCAN,
    MANUAL,
    GEOFENCE
}

enum class AttendanceStatus {
    PRESENT,
    LATE,
    ABSENT,
    EXCUSED
}

​
UI Flow

@Composable
fun QRScannerScreen(
    onScanSuccess: (String) -> Unit,
    onScanError: (String) -> Unit,
    onDismiss: () -> Unit
) {
    // Camera preview with QR scanning overlay
    // Shows scanning guide/frame
    // Handles scan results
    // Displays success/error messages
}

​
Backend Integration

1

Generate QR Code

Backend generates unique QR codes for each class session with encrypted data
2

Student Scans

Student scans QR code, app decodes and extracts class session ID and timestamp
3

Submit Attendance

App sends attendance record to backend API with student ID and scan data
4

Verify & Store

Backend verifies time validity and enrollment, stores attendance record
5

Confirmation

App receives confirmation and updates UI to show attendance recorded

​
User Experience Design

​
Scanner Overlay

The QR scanner should include:
  • Camera preview: Full-screen camera view
  • Scanning frame: White or gold square indicating scan area
  • Instructions: “Position QR code within frame”
  • Close button: X button to dismiss scanner
  • Flashlight toggle: For scanning in low light

​
Success State

✓ Attendance Recorded

Cálculo Diferencial
09:00 - 10:00 AM
Edificio K, Aula 5

You've been marked present for this class.

​
Error States

Invalid QR Code

“This QR code is not valid for attendance.”

Expired Code

“This QR code has expired. Please ask your professor for a new one.”

Wrong Class

“This QR code is for a different class or time.”

Already Recorded

“You’ve already recorded attendance for this class.”

​
Security Considerations

Time Validation

QR codes should only be valid during class time, with a small buffer before/after

Encryption

QR code data should be encrypted to prevent forgery

One-Time Use

QR codes should rotate periodically during class to prevent sharing

Location Check

Optional: Verify student is within campus geofence

​
Attendance History

The feature could also include an attendance history view: 
Attendance Record

This Week: 8/10 classes
This Semester: 85/90 classes (94%)

Recent Activity:
✓ Cálculo Diferencial - Mar 14, 9:00 AM
✓ Programación O.O. - Mar 14, 10:00 AM
✗ Física I - Mar 14, 8:00 AM (Absent)
✓ Inglés IV - Mar 13, 1:00 PM

​
Implementation Priority

1

Phase 1: Scanner UI

Implement camera permission handling and QR scanner UI
2

Phase 2: Local Scanning

Add QR code detection and decoding without backend
3

Phase 3: Backend Integration

Connect to attendance API for recording and verification
4

Phase 4: Attendance History

Add UI to view attendance records and statistics

​
Alternative Attendance Methods

Beyond QR codes, the system could support:

NFC

Tap phone to NFC reader in classroom

Geofence

Automatic check-in when entering classroom geofence

Bluetooth

Proximity detection with classroom Bluetooth beacons

​
Benefits

Fast Check-in

Students can mark attendance in seconds without manual roll call

Accurate Records

Eliminates manual errors and provides timestamped records

Student Visibility

Students can track their own attendance in real-time

Analytics

Provides data for attendance patterns and engagement analysis

Home Screen

The QR scanner FAB is located on the Home Screen

Schedule

Attendance could be integrated into the schedule view

Student Profile

Attendance statistics could be displayed in the profile