flutterチュートリアルの外部パッケージ導入で詰まったときのメモ

flutterチュートリアルをしていたら、

https://flutter.ctrnost.com/tutorial/tutorial04/

外部パッケージの導入でつまづいたのでメモ

dependencies:
    flutter:
      sdk: flutter
  cupertino_icons: ^0.1.2
  english_words: ^3.1.0

ここで、

flutter packages get

してプロジェクトを実行すると

engliesh_wordsがnull-safetyでないというmigrateエラーがでたので

以下のサイトにて

https://zenn.dev/hirothings/scraps/294558ad228cb

flutter pub outdated --mode=null-safetyでアプリの依存パッケージが、null-safety対応しているか確認ができる

  • [✗] 未対応
  • [✓] null安全対応

dart pub upgrade --null-safety で依存パッケージをNull-Safety版の最新にアップデートできるこのコマンドはpubspec.ymlを書き換える

とあったのでそれを参考に

(公式はこちら

パッケージをnull safety版に移行

flutter pub outdated --mode=null-safety
dart pub upgrade --null-safety

1行目のコマンドで

  • [✗] 未対応
  • [✓] null安全対応

パッケージがnull-safety対応していないものが表示されるので、

null安全対応のバージョンに移行したい

2行目のコマンドでそれらのパッケージをnull-safety版の最新にアップデート。

dart migrate

コマンドを打つと

dart migrateエラー
というエラー

1. Set the lower SDK constraint (in pubspec.yaml) to a version before 2.12.より、

dartのバージョンを2.12以前のものにする必要がある

dart —versionしてdartのバージョンを確認してみると2.17.6だった

dartのバージョン変更方法を探した結果

dvmというバージョンマネージャーを見つけたのでそれを導入しようとしたが

Because pub global activate depends on dvm any which requires SDK version >=1.22.0 <2.0.0, version solving failed.

1.22.0~2.0.0までしか対応していないらしい

https://zenn.dev/riscait/articles/flutter-version-management

こちらのサイトよりFlutter SDKのバージョン管理ツールFVMを使って

プロジェクトごとにflutterのバージョンを変えることができるみたいなので

変更してみる。

こちらのflutter versionとdart versionの対応表を参考に

https://docs.flutter.dev/development/tools/sdk/releases

flutter,dart バージョン対応表

左端がflutter versionで、右端がdart version

dart 2.12.0に対応しているのはflutter 2.0.0らしい

プロジェクトルート直下で

fvm use 2.0.0

コマンドを入力し

fvm use

このプロジェクトでflutter2.0.0を使うように変更

dartのバージョンファイルを書き換えてみる

C:\src\flutter\bin\cache\dart-sdk

私の場合ここにversionファイルがあるので

versionファイルをエディタで開いて

2.17.6だったのを2.12.0に変更

すると無事プロジェクトが実行できるようになりました

手順を思い出しながら書いたので抜けがあったり、エラーの画面がスクショできていない箇所があったりしますが参考になれば幸いです。

うさんぽ①

キャラを動かす

 

※ブログの更新を怠っていて、一番最初にした作業を今さらブログにしています

 

こちらの記事を参考にうさぎを動かせるようにしました

 

UnityでRPGを作るpart1 歩行アニメーションと操作 - Qiita

 

スプライトは相方が用意してくれました↓

かわいい

 

本当は前後左右それぞれの向きで用意する必要があるので

最終的には4×4の16マスのものを準備しないといけないのですが、

一旦後ろ向きのものだけ用意して、それを前後左右すべてに適用して動かします。

 

まず、ProjectのAssetsというフォルダにimagesというフォルダをつくって、そこにコマ割り画像を登録します

 

 

オブジェクト詳細画面からsprite editorを開いて、画像をコマごとにスライスします。

参考記事では行数、列数を指定して16マスに分割していますが、ここではコマが4つしかないので、Automaticでセルを分割しています。

 

次にアニメーションを作成していきます。

スプライトのオブジェクトを左上のHierarchyにドラッグし、オブジェクトを選択した状態で上部バーのWindowからAnimation→Animationを選択します。


するとこのような画面が表示されるので、createを押した後、Add PropertyからSprite Renderer→Sprite横の+を押します


これでアニメーションが作成できます。

再生ボタン▶を押すと、アニメーションが確認できます。

 

次に、動かす方向によってアニメーションが切り替わるように設定します

(ここでは全方向に後ろ向きのものを使います)

アニメーションの作成時に同時に作成されたこのアイコンをダブルクリックします。

このような画面が表示されますが、 何もないところで右クリック→Create State→From New Blend Treeを 選択、作成されたブロックをもう一度右クリックしてSet as Layer Default Stateを選択します。
すると、Entryから生えている線が作ったブロックに向きます。

色のないブロックは消しておきます。

 

Blend Treeをダブルクリックし、InspectorのBlend Typeを2D Simple Directionalにし、Parametersをx,yにします

Motionの右下にある+ボタンから、Add Motion Fieldを選択し、4つ追加します。アニメーションには先ほど作成したアニメーションを設定し(ここでは全方向に後ろ向きのものを((ry )、座標は上、下、左、右の順になるように設定しています。



最後にキャラクターを動かすためのスクリプトを書きます。

まず、オブジェクトにRigidbody 2Dコンポーネントを追加して、Body TypeをKinematicに設定します。

そして、右クリックからCreate→C# Scriptを選択してスクリプトファイルを作成します。ファイルをクリックするとvisual studioが立ち上がるので、visual studioでコードを書いていきます。

 

コードは参考記事の通りなので割愛します。

スクリプトファイルをオブジェクトに関連付けたら終了です。



 

 

 

unityでうさぎのお散歩ゲームを作ってみようという話(初心者)

就活のために自分のポートフォリオが作りたかった。

しかし、ポートフォリオに追加できるようなものが全然ない。

ということで、大学二年の春休みにゲームを作り始めました。

ゲームエンジンはUnity(使ったことない)で、テーマはうさぎのお散歩ゲーム。

略して”Usanpo"。

ゲーム制作経験は大学の授業でのシナリオゲーム作成くらいで、

初心者も初心者ですが、昨今はネット記事が豊富なので心強い。
Unityでゲーム制作経験ありの相方もいます。

 

 

ちなみに2Dの見下ろし型で、ドットです。

ドット絵も最近興味をもったばかりで、少しずつ描き始めたところです。

ドットピクトというソフトで、スマホで練習中です。

(あわよくばドット絵もポートフォリオに入れれるレベルまで行きたい。。)

ソース管理はgithubとSourcetreeで行っています。

 

これから進捗などをこのブログで書き留めていこうと思います。
(関係ないことも書きます)