Menu
CoddyTech
flag Ar iconالعربيةdown icon

عدّاد تصاعدي وتنازلي

جزء من قسم إضافة التفاعلية في رحلة Flutter على Coddy. الدرس 13 من 34.

يمكن أن تعيش دالة أيضًا داخل الصنف State. وهناك يمكنها قراءة متغيرات الحالة واستدعاء setState:

void _increase() {
  setState(() {
    _count++;
  });
}

_count++ اختصار لـ _count = _count + 1، و_count-- تنقص واحدًا. تُسمّى الدالة التي تنتمي إلى صنف طريقة، وتبدأ الطريقة الخاصة بـ _، مثل المتغيرات.

مرّرها إلى زر باستخدام اسمها، من دون أقواس، كما في «دوالك الخاصة»: IconButton(icon: Icon(Icons.add), onPressed: _increase).

challenge icon

التحدي

سهل

يزداد العداد فقط. أضف دالة _decrease تُنقص واحدًا داخل setState، وزر IconButton مع Icons.remove قبل الرقم يستدعيها.

جرّب بنفسك

import 'package:flutter/material.dart';

void main() {
  runApp(const MyApp());
}

class MyApp extends StatelessWidget {
  const MyApp({super.key});

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      debugShowCheckedModeBanner: false,
      home: HomePage(),
    );
  }
}

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

  @override
  State<HomePage> createState() => _HomePageState();
}

class _HomePageState extends State<HomePage> {
  int _count = 0;

  void _increase() {
    setState(() {
      _count++;
    });
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(title: Text('Counter')),
      body: Center(
        child: Row(
          mainAxisSize: MainAxisSize.min,
          children: [
            Text('$_count', style: TextStyle(fontSize: 48)),
            IconButton(icon: Icon(Icons.add), onPressed: _increase),
          ],
        ),
      ),
    );
  }
}
quiz iconاختبر نفسك

يتضمن هذا الدرس اختبارًا قصيرًا. ابدأ الدرس للإجابة عليه وتتبّع تقدمك.

جميع دروس إضافة التفاعلية

تدرّب بنفسك: مترجم Flutter عبر الإنترنت