import 'package:flutter/material.dart';
class CiCdSetupScreen extends StatelessWidget {
const CiCdSetupScreen({super.key});
void _showInfoDialog(BuildContext context) {
showDialog(
context: context,
builder: (context) => AlertDialog(
title: const Text('About GitHub Actions'),
content: const Text('GitHub Actions lets you automate your Flutter app build, test, and deployment steps whenever you push code. It helps keep your app updated and tested automatically.'),
actions: [
TextButton(
onPressed: () => Navigator.of(context).pop(),
child: const Text('Close'),
),
],
),
);
}
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: const Text('Flutter CI/CD Setup Guide'),
),
body: Padding(
padding: const EdgeInsets.all(16.0),
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
const Text('1. Connect your GitHub repo', style: TextStyle(fontSize: 18)),
const SizedBox(height: 12),
const Text('2. Add workflow YAML file', style: TextStyle(fontSize: 18)),
const SizedBox(height: 12),
const Text('3. Configure build and test', style: TextStyle(fontSize: 18)),
const SizedBox(height: 12),
const Text('4. Deploy to Firebase App Distribution', style: TextStyle(fontSize: 18)),
const Spacer(),
SizedBox(
width: double.infinity,
child: ElevatedButton(
onPressed: () => _showInfoDialog(context),
child: const Text('Start Setup'),
),
),
],
),
),
);
}
}
This screen uses a simple Column to list the four main steps for setting up CI/CD with Flutter and GitHub Actions. Each step is a Text widget with spacing in between for clarity.
The Spacer pushes the button to the bottom of the screen, making the layout clean and balanced.
The ElevatedButton triggers a dialog that briefly explains what GitHub Actions is, helping beginners understand the automation concept.
Padding around the content ensures the text and button are not too close to screen edges, improving readability and touch comfort.
