🧑‍🏫01. Переменные часть 1

Видео урок

// Some code
class VaribalesScreen extends StatefulWidget {
  const VaribalesScreen({super.key});

  @override
  State<VaribalesScreen> createState() => _VaribalesScreenState();
}

class _VaribalesScreenState extends State<VaribalesScreen> {
  // Примтивные типы данных
  String name = 'Nuskayim';
  String surname = 'Shumdyraeva';

  bool isRain = false;
  bool isMarried = true;

  int age = 54;

  double kg = 76.90;
  double km = 54.89;

  double width = 300;
  double height = 80;

  // Flutter типы данных
  Color green = Colors.green;
  Color red = Colors.red;

  IconData favorite = Icons.favorite;
  IconData person = Icons.person;

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(),
      body: Column(
        children: [
          Text(name),
          Text(name),
          Text(name),
          Text('Идет дождь - $isRain'),
          Text('Замужем - $isMarried'),
          Text('возраст $age'),
          Container(
            height: height,
            width: width,
            color: green,
          ),
          SizedBox(
            height: 10,
          ),
          Container(
            height: height,
            width: width,
            color: green,
          ),
          SizedBox(
            height: 10,
          ),
          Container(
            height: height,
            width: width,
            color: green,
          ),
          SizedBox(
            height: 10,
          ),
          Container(
            height: height,
            width: width,
            color: green,
          ),
        ],
      ),
    );
  }
}

class LogicVariables extends StatefulWidget {
  const LogicVariables({super.key});

  @override
  State<LogicVariables> createState() => _LogicVariablesState();
}

class _LogicVariablesState extends State<LogicVariables> {

  // = - МЕнять

  String name = 'Baiastan';
  Color containerColor = Colors.green;

  double width = 100;
  double height = 100;


  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(),
      body: Column(
        children: [
          Text(name),

          ElevatedButton(
            onPressed: () {

              setState(() {
                name = 'Hello world';
              });

            },
            child: Text('Изменить имя'),
          ),

          InkWell(
            onTap: ( ){
              setState(() {
                containerColor = Colors.red;
                width = 200;
                height = 400;
              });
            },
            child: Container(
              height: height,
              width: width,
              color: containerColor,
            ),
          )
        ],
      ),
    );
  }
}

Исходный код

import 'package:flutter/material.dart';

class Lesson01 extends StatefulWidget {
  const Lesson01({super.key});

  @override
  State<Lesson01> createState() => _Lesson01State();
}

class _Lesson01State extends State<Lesson01> {
  String title = 'Lesson 01';
  String name = 'Flutter';

  int number = 0;
  int age = 78;

  double height = 0.0;
  double width = 0.0;

  bool isTrue = true;
  bool isFalse = false;
  bool isAdult = true;

  Color color = Colors.blue;

  Widget text = const Text('Hello');
  Container cube = Container(height: 100, width: 100, color: Colors.red);

  String hello = 'Hello 01';

  double counter = 0;

  @override
  Widget build(BuildContext context) {
    return  Scaffold(
      body: SafeArea(
        child: Column(
          children: [
            Text(hello),
            Text(hello),
            Text(hello),
            Text(hello),
            Text(hello),
            Text('$number'),
            Text(age.toString(), style: const TextStyle(fontSize: 30),),
            const SizedBox(height: 20,),
             Text('$counter', style: const TextStyle(fontSize: 30, fontWeight: FontWeight.bold),),

            Row(
              mainAxisAlignment: MainAxisAlignment.spaceAround,
              children: [
                ElevatedButton(onPressed: (){
                  setState(() {
                    counter++;
                  });
                }, child: const Text('+')),
                ElevatedButton(onPressed: (){
                 setState(() {
                   counter--;
                 });
                }, child: const Text('-')),
                ElevatedButton(onPressed: (){
                  setState(() {
                    counter *= 2;
                  });
                }, child: const Text('*')),
                ElevatedButton(onPressed: (){
                  setState(() {
                    counter /= 2;
                  });
                }, child: const Text('/'))
              ],
            )
          ],
        ),
      ),
    );
  }
}

Что такое переменные?

Представь себе переменные как ящики или контейнеры, куда мы можем положить данные. Например, если тебе нужно хранить какое-то значение (число, текст, картинку и т.д.), ты создаешь переменную и кладешь это значение в нее. Переменная - это имя, которое указывает на конкретное место, где хранятся данные.

Пример: В Dart, если нам нужно сохранить возраст человека, мы можем создать переменную:

int age = 25;

Здесь age - это "ящик" с именем, где хранится значение 25.

2. Типы данных

Тип данных – это как этикетка на ящике, которая подсказывает, что можно положить в этот ящик. Dart использует разные типы данных, чтобы указывать, какого рода значение будет храниться в переменной.

• int – целые числа (например, 3, -10, 42)

• double – числа с плавающей запятой (например, 3.14, -0.5)

• String – текст (например, "Привет", "Flutter")

• bool – логический тип, который может быть только true или false

Пример:

String name = "Alice";
bool isStudent = true;

3. Нулевая безопасность (null safety)

Когда переменная "nullable" (может быть пустой), это значит, что в неё можно положить значение null (как будто ящик пустой). Однако пустой ящик может привести к ошибкам, когда ты ожидаешь там что-то найти. Dart поддерживает нулевую безопасность, чтобы защитить код от таких ошибок.

Как это выглядит в Dart:

String? nullableName; // ? после String позволяет name быть null
nullableName = null;

4. Ключевые слова для переменных

• var – если не знаешь, какой именно тип данных нужно указать, используй var. Dart автоматически определит тип данных.

  var city = "Moscow"; // Dart понимает, что это String

• dynamic – позволяет переменной менять тип данных на лету. Это как ящик без чёткой этикетки: туда можно положить что угодно.

  dynamic value = 10;
  value = "Теперь я строка!";

• const и final – для значений, которые ты не хочешь изменять.

  • const – значение известно сразу, как программа запускается.

  • final – значение присваивается один раз, но может вычисляться во время работы программы.

  const double pi = 3.14;
  final currentTime = DateTime.now(); // Присвоится при запуске

• late – позволяет отложить инициализацию переменной до момента, когда она действительно понадобится. Полезно для переменных, которые требуют времени на создание, но не используются сразу.

  late String description;
  description = "Flutter – это круто!";

5. Использование переменных в Flutter

Переменные в Flutter используются для хранения данных, которые связаны с отображением информации на экране.

Пример 1: Текст приветствия

String greeting = "Привет, мир!";

@override
Widget build(BuildContext context) {
  return Text(greeting);
}

Пример 2: Переключатель состояния (bool для состояния)

bool isSwitched = false;

@override
Widget build(BuildContext context) {
  return Switch(
    value: isSwitched,
    onChanged: (value) {
      setState(() {
        isSwitched = value;
      });
    },
  );
}

Пример 3: Счётчик с целым числом

int counter = 0;

@override
Widget build(BuildContext context) {
  return Column(
    children: [
      Text("Счётчик: $counter"),
      ElevatedButton(
        onPressed: () {
          setState(() {
            counter++;
          });
        },
        child: Text("Увеличить"),
      ),
    ],
  );
}

Пример 4: Отображение времени (final)

final DateTime now = DateTime.now();

@override
Widget build(BuildContext context) {
  return Text("Текущее время: $now");
}

Пример 5: Список задач с использованием var

var tasks = ["Задача 1", "Задача 2", "Задача 3"];

@override
Widget build(BuildContext context) {
  return ListView.builder(
    itemCount: tasks.length,
    itemBuilder: (context, index) {
      return ListTile(title: Text(tasks[index]));
    },
  );
}