Flutterで外部パッケージを使ってみよう！ 📦
パッケージって何だろう？ 🤔
みなさん、スマートフォンでアプリを使うとき、新しい機能が必要になったら全部自分で作りますか？
そうですね、普通は必要な機能をダウンロードして使いますよね！
Flutterでも同じように、便利な機能をダウンロードして使うことができます。
これを「パッケージ」と呼びます。パッケージは、誰かが作った便利な道具箱のようなものです！
今日使うパッケージの紹介 📝
今回は english_words というパッケージを使ってみましょう。
このパッケージは、ランダムに英単語を作り出してくれる魔法の箱です！
パッケージの追加方法 🎯
Step 1: パッケージを教える 📚
まず、私たちのアプリに「english_words」というパッケージを使いたいと教えます。
pubspec.yamlというファイルを開いて、以下のように書き足します：
dependencies:
flutter:
sdk: flutter
cupertino_icons: ^0.1.2
english_words: ^3.1.0 # これを追加！
これは、お買い物リストのようなもので、「このアプリには these packages が必要です！」と書いているんです。
Step 2: パッケージをダウンロード 🚀
パッケージを実際に手に入れましょう！
通常はpubspec.yamlを保存すると自動でダウンロードが始まります。
もし自動でダウンロードされない場合は、以下のコマンドを使います：
flutter packages get
これは、「パッケージさん、来てください！」とお願いするようなものです。
Step 3: パッケージを使う準備 📱
次に、私たちのプログラムでパッケージを使えるようにします。
lib/main.dartの一番上に以下の行を追加します：
import 'package:flutter/material.dart';
import 'package:english_words/english_words.dart'; // 新しい行を追加！
これは、「english_wordsパッケージを使わせてください！」とお願いしているようなものです。
パッケージを使ってみよう！ 🎮
では、実際にランダムな英単語を表示してみましょう。
以下のようにmain.dartを変更します：
@override
Widget build(BuildContext context) {
final wordPair = WordPair.random(); // ランダムな英単語を生成！
return MaterialApp(
title: 'Welcome to Flutter',
home: Scaffold(
appBar: AppBar(
title: Text('Welcome to Flutter'),
),
body: Center(
child: Text(wordPair.asPascalCase), // 生成した単語を表示！
),
),
);
}
何が変わったの？ 🔄
-
WordPair.random()で、ランダムな英単語のペアを作ります -
.asPascalCaseで、きれいな形式で表示します（例：'CoolWords'） - アプリを更新するたびに、新しい単語が表示されます！
面白い発見 💡
- 画面を更新するたびに新しい単語が表示されるのは、
buildメソッドが呼ばれるたびに新しい単語を生成しているからです - これは、おもちゃのガチャガチャのように、回すたびに新しいものが出てくるようなものです！
やってみよう！ 🌟
- アプリを何回か更新して、どんな単語が出てくるか見てみよう
- 表示される単語の形式を変えてみよう（
.asPascalCaseを.asLowerCaseに変えてみる） - 自分で好きな単語を表示してみよう
他のパッケージを探してみよう 🔍
Flutterには、たくさんの便利なパッケージがあります！
Flutter Packagesで探してみましょう。
- 画像を表示するパッケージ
- 音楽を再生するパッケージ
- アニメーションを作るパッケージ
など、いろいろあります！
大切なポイント ⭐️
- パッケージは便利な道具箱
-
pubspec.yamlでパッケージを追加 -
importで使えるようにする - たくさんのパッケージを組み合わせて素敵なアプリを作ろう！
パッケージを使えば、もっともっと楽しいアプリが作れるようになりますよ！
がんばって実験してみましょう！ 💪