Tarif Kitabı: Tarif Listesi

Coddy'nin Flutter Journey'sinin Listeler ve Ekranlar bölümünün bir parçası. Ders 28 / 33.

Bu bölümde öğrendiklerinle baştan sona bir uygulama yapma zamanı: bir tarif defteri. Uygulamada tariflerin listesi, her tarifin malzemelerini gösteren bir ekran ve favorilerinizin bulunduğu bir sekme var.

Verilerle başlayın. Uygulamada zaten adı, hazırlanma süresi ve malzeme listesi olan bir Recipe sınıfı ve build yönteminin başında dört tarif var. Her tarifin ingredients özelliği bir List<String>; bir alan da liste olabilir.

İlk ekran liste ekranıdır. Tarif sayısı yüzlere çıkabileceğinden, bu ekranı her tarif için bir ListTile kullanarak ListView.builder ile oluşturun.

Görev

Kolay

No recipes yet metnini tarifler listesiyle değiştir:

her tarif için bir ListTile içeren bir ListView.builder
her kutucuğun leading: değeri olarak Icons.restaurant_menu, başlık olarak tarifin adı ve alt başlık olarak 20 min (tarifin dakika süresiyle birlikte) bulunur

Kendin dene

import 'package:flutter/material.dart';

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

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

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

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

  @override
  Widget build(BuildContext context) {
    final List<Recipe> recipes = [
      Recipe(name: 'Pancakes', minutes: 20, ingredients: ['Flour', 'Eggs', 'Milk', 'Butter']),
      Recipe(name: 'Tomato Soup', minutes: 35, ingredients: ['Tomatoes', 'Onion', 'Garlic', 'Olive oil']),
      Recipe(name: 'Guacamole', minutes: 10, ingredients: ['Avocados', 'Lime', 'Onion', 'Salt']),
      Recipe(name: 'Fried Rice', minutes: 25, ingredients: ['Rice', 'Eggs', 'Peas', 'Soy sauce']),
    ];
    return Scaffold(
      appBar: AppBar(title: const Text('Recipe Book')),
      body: const Center(
        child: Text('No recipes yet'),
      ),
    );
  }
}

class Recipe {
  final String name;
  final int minutes;
  final List<String> ingredients;

  Recipe({required this.name, required this.minutes, required this.ingredients});
}