|
Labarotoriya ishi №12. Mavzu: Flutter freymvorkida foydalanuvchi interfeysini ishlab chiqish. Flutterda Android va ios uchun mobil ilovalarni ishlab chiqish. Ishdan maqsad
|
bet | 2/3 | Sana | 13.05.2024 | Hajmi | 18,13 Kb. | | #229543 |
Bog'liq 21,22"Counter" ilovasi
main.dart fayli:
Dart tilida yozilgan kodingizning boshida keladigan main fayli. Bunda ilovani boshlash uchun MyApp widgeti chaqiriladi.
import 'package:flutter/material.dart';
import 'my_app.dart';
void main() {
runApp(MyApp());
}
my_app.dart fayli:
Bu faylda ilovadagi bosh widget, yani MyApp widgeti joylashadi. U ilova boshlandiqda ekranga chiqadigan bosh sahifa sifatida xizmat qiladi.
import 'package:flutter/material.dart';
import 'counter_screen.dart';
class MyApp extends StatelessWidget {
@override
Widget build(BuildContext context) {
return MaterialApp(
title: 'Counter App',
theme: ThemeData(
primarySwatch: Colors.blue,
),
home: CounterScreen(),
);
}
}
counter_screen.dart fayli:
Bu faylda "Counter" ekranini tavsiflash uchun CounterScreen widgeti ishlatiladi. U yuzasidan CounterBody widgeti chaqiriladi.
import 'package:flutter/material.dart';
import 'counter_body.dart';
class CounterScreen extends StatelessWidget {
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: Text('Counter App'),
),
body: CounterBody(),
);
}
}
counter_body.dart fayli:
Bu faylda "Counter" ilovasining asosiy qismini yaratish uchun CounterBody widgeti chaqiriladi.
import 'package:flutter/material.dart';
class CounterBody extends StatefulWidget {
@override
_CounterBodyState createState() => _CounterBodyState();
}
class _CounterBodyState extends State {
int counter = 0;
@override
Widget build(BuildContext context) {
return Center(
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
children: [
Text(
'San\'atlar soni:',
style: TextStyle(fontSize: 20),
),
Text(
'$counter',
style: TextStyle(fontSize: 40, fontWeight: FontWeight.bold),
),
SizedBox(height: 20),
ElevatedButton(
onPressed: () {
setState(() {
counter++;
});
},
child: Text('San\'atni oshirish'),
),
],
),
);
}
}
Bu misol, oddiy bir "Counter" ilovasini ko'rsatadi. ElevatedButton bosilganda, san'atlar soni oshiriladi va yangilangan qiymat ekranga chiqadi. Bu ilova, asosan, Flutter freymvorkida "stateful widget"ni o'rganishda yaxshi boshlang'ich nuqta bo'lishi mumkin. Siz ushbu misolni o'zgartirib, qo'shimcha interfeys elementlarini qo'shishingiz va interaktivlikni oshirishingiz mumkin.
|
|
Bosh sahifa
Aloqalar
Bosh sahifa
Labarotoriya ishi №12. Mavzu: Flutter freymvorkida foydalanuvchi interfeysini ishlab chiqish. Flutterda Android va ios uchun mobil ilovalarni ishlab chiqish. Ishdan maqsad
|