Menggunakan Conditional Operator

Seperti bahasa modern lainnya, dart juga memiliki conditional operator. Sederhananya adalah if block untuk single statement. Conditional operator menggunakan tanda “?” dan “:” untuk menunjukan block.

Kita akan melakukan beberapa finishing sebelum mengakhiri tutorial pengenalan flutter ini.

• Mendeteksi indeks dari questions, bila sudah akhir indeks, maka ditampilkan screen ending.
• Menggunakan private, agar class tidak bisa diakses diluar file itu sendiri.

Untuk mendeteksi indeks, kita akan gunakan conditional operator, berikut penerapannya:

        body: qIdx < questions.length
            ? Column(
                children: [
                  Question(questions[qIdx]['qtxt']),
                  ...(questions[qIdx]['qans'] as List<String>).map((answer) {
                    return Answer(btnAnswer, answer);
                  }).toList()
                ],
              )
            : Center(
                child: Column(
                  children: <Widget>[
                    Text('End of quiz'),
                    FlatButton(
                      child: Text('Restart App'),
                      onPressed: restartApp,
                    )
                  ],
                ),
              ),

Untuk menunjukan sebuah class adalah private, nama class harus diawali dengan tanda underscore “_”. Ini bukan cosmetic penulisan, tetapi operator yang dikenali oleh dart untuk menunjukan suatu object (class atau variable) adalah private.

class _MyAppState extends State<MyApp> {
  ...
  ...
  ...
}

Berikut program lengkap dari main.dart setelah dilakukan perubahan

import 'package:flutter/material.dart';

import './question.dart';
import './answer.dart';

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

class MyApp extends StatefulWidget {
  @override
  State<StatefulWidget> createState() {
    return _MyAppState();
  }
}

class _MyAppState extends State<MyApp> {
  var questions = [
    {
      'qtxt': 'Warna favorite ?',
      'qans': ['Hitam', 'Merah', 'Putih'],
    },
    {
      'qtxt': 'Olah raga favorite ?',
      'qans': ['Jogging', 'Yoga', 'Renang'],
    },
    {
      'qtxt': 'Binatang favorite ?',
      'qans': ['Harimau', 'Ular', 'Kelinci'],
    },
  ];
  var qIdx = 0;

  void btnAnswer() {
    setState(() {
      qIdx = qIdx + 1;
    });
    print(qIdx);
  }

  void restartApp() {
    setState(() {
      qIdx = 0;
    });
  }

  @override
  Widget build(BuildContext ctx) {
    return MaterialApp(
      home: Scaffold(
        appBar: AppBar(
          title: Text('My Hello Flutter'),
        ),
        body: qIdx < questions.length
            ? Column(
                children: [
                  Question(questions[qIdx]['qtxt']),
                  ...(questions[qIdx]['qans'] as List<String>).map((answer) {
                    return Answer(btnAnswer, answer);
                  }).toList()
                ],
              )
            : Center(
                child: Column(
                  children: <Widget>[
                    Text('End of quiz'),
                    FlatButton(
                      child: Text('Restart App'),
                      onPressed: restartApp,
                    )
                  ],
                ),
              ),
      ),
    );
  }
}

Pada modul ini, tidak dibahas program yang kompleks, karena lebih bertujuan untuk menjelaskan konsep dasar widget dan struktur file serta pengenalan beberapa perintah dart.

Anda bisa kembangkan aplikasi mengembalikan perhitungan hasil personality quiz dalam end screen. Anda bisa juga buat styling agar end screen lebih enak untuk dibaca. SIlakan bereksperimen.