ゼロからFlutterでアプリ開発するんやで。

Flutter(Google製アプリ構築ツールキット)を遊びながら学んでいくんやで。

2020-05-01から1ヶ月間の記事一覧

Flutterでタブメニューからリストを表示するんやで。[TabBar][TabBarView][ListView][ListTile] 

Flutterのタブとリストの各表示方法はネット上にも、まあまあ情報がある。 だ〜がしかし、、 タブメニュー押したら、リストを表示したいやん。 で、ググっても 情報ないやーーーーーーーーん。 こんなよく使いそうな事ないんかーーい、、 って事で鬼滅の刃の…

Flutterで、鬼滅の刃。ねずこが咥えている物をボタンで変更するんやで。[BottomNavigationBar]

ねずこの竹、違う物にしたい!! 君もそう思った事があるやろ。 そんな時に便利なんは BottomNavigationBar やで!! 早速やけど見てみて!こんな感じやで! って事で今回はまずイラスト3枚用意。 背景をねずこにして竹だけを変更してもええねんけど、 今回…

Flutterプログラミングで鬼滅の刃[水の呼吸 弐ノ型]してみた。AnimatedBuilder

鬼滅の刃!! 水の呼吸 弐ノ型 水車!! 作ってみるんやで!! って事でイラスト書いたんや。 背景が透過PNGで保存するんやで。 透過PNGって何?って人は、背景がスケてるイラスト画像の事やで。 今回は水車の感じだけを回したいから、 水車と炭治郎を別々で…

Flutterでクレヨンしんちゃんの愛情表現を実装。[AnimatedCrossFade]

今回はクレヨンしんちゃんのお尻から学ぶんやで!! 画像を2枚使ってアニメーションさせるんや! てことで2枚書いたんや。ええお尻やな。 これをクロスフェードさせるんやで!! そんな時はこれや!! AnimatedCrossFade!!! けど、ほんまは3枚の画像を順…

Flutterでうんこ流せたんやで!![完成]

突然やけど、 StatelessWidgetは静的 StatefulWidgetは動的 って事らしいから、 ボタンでうんこを流す為に、前回までのコードもいくつか変更するんやで! まず、うんこ画像 //うんこ画像コード class MyUnko extends StatelessWidget { @override Widget bui…

Flutterでボタンの位置を変えてええ感じにするんやで。[FloatingActionButtonLocation ]

今回はボタンを真ん中にしたりええ感じにするんやで! そんな時はこれや!! FloatingActionButtonLocation! フローティングアクションボタンロケーションや! floatingActionButtonLocation: FloatingActionButtonLocation.centerFloat, ボタンのコードの…

Flutterでうんこを流す為のボタンをつけるんやで。[FloatingActionButton]

Flutterにはめちゃいい簡単に付けられるボタンがあるねん。 それは FloatingActionButton や! フローティングアクションボタン や! かなり使えそうやから二回言っとくわ。 floatingActionButton: FloatingActionButton( child: Icon(Icons.add), onPressed…

Flutter[DartPad]のサンプルのいらないコードを一旦整理します。

前回までの流れ[うんこ編] テキストのうんこを画像に変える。 bon-programming.hatenablog.com 背景をトイレにする。 bon-programming.hatenablog.com うんこの画像サイズを変更 bon-programming.hatenablog.com うんこ画像の位置を微調整 bon-programming.h…

Flutterでうんこ画像の位置を少し下にしてみるんやで。

前回はうんこを小さくしたけど、 うんこが便器の内側に、こびりついてるから もう少し下に移動させたいんやで。 MyUnkoのコンテナの中に位置を指定できるコード書いてみた。 ドヤ!! ええや〜ん! 38行目にこれ追加したで。 alignment: Alignment(0.0, 0.2)…

Flutterで背景画像の上にのせた画像サイズを変更するんやで。

前回は背景を表示できたけど、上に乗ってるうんこが大きすぎた。 たまに出るびっくりすぎるくらいの大きなうんこはあるけど、 ここでは小さくしたいんやで。 って事で、 元の大きなサイズの画像を縮小して表示するんやでっ!! しかし、、、 いろいろ試して…

Flutterで背景画像を表示してみるんやで。

前回は、うんこ画像を表示できた。 うんこを表示したら、便器に流したくなった。 人間だもの って事で、次は背景をトイレにするんやで。 イラスト書いたで。 body: Containerの中に 下記: 19行目から24行目を追加したで。 decoration: BoxDecoration( image:…

プログラミング息抜き Flutterってこんな感じやろ?

なかなかええんちゃうん?

突然ですが、Flutterキャラ第一弾やで〜。プログラミングには息抜きが必要やな。

名前はトンボロ博士やで!! 頭がトンボロ現象みたいやから。 口癖は ホットリローーーーーーーード!! やねんで。 今後ともトンボロ博士よろしくやで!!

DartPadのFlutterでサンプルプログラムを触ってみるんやで。[2.画像表示 ]

前回で書いた文字[うんこ]を 画像にするんやで! 使用する画像が必要って事で うんこのイラストを書いてみた。 ※背景透過のPNG形式で保存 なんか。。腹たつうんこやな、、 下の前回のコードをよ〜く見て解析してみようや! 画面表示の基本となるコードは16~1…

DartPadのFlutterでサンプルプログラムを触ってみるんやで。[1.テキスト変更 ]

じゃぁぁあああ〜ん!! DartPadをブログに貼り付けたで!!! 思う存分触ってみてや!! 注意:PCで見るかスマホなら横向きでみてや〜 プログラム変更後は右上の[Run]ボタン押すんやで! https://dartpad.dev/flutter このプログラム内容は文字を出すプログ…

とりあえずDartPadでFultter体験してみよーや!

前回の記事で説明したんやけど、もう一回言うとくで! Flutter始めるんやったら、 とりあえず「DratPad」で 感覚を覚えたらええねん!! DratPadでFultterを体験するんやで〜!!です。 DratPad下記リンクhttps://dartpad.dev/ ※注意:PCからみる事をオススメ…

Flutterのダウンロード『ちょっと待った!!!!』

Flutterを始めようとしている貴方!! Flutterをダウンロードする事から、始めようと思ってない? グーグル先生や公式サイトに聞いても、まずその流れになりますね。 例外なく私自身もそうでした。 その考え『ちょーーーーとまった!!』やで。 FlutterをPC…

Flutterでアプリ開発ができる!?ほんまかいな!!

んで、、Flutter(フラッター)って何なん? バケラッタしか知らんわ。 マンガの[オバケのQ太郎]に出てくる弟のO次郎の口癖な。 ばけらった〜〜!! そんなことはどうでもええか。 とりあえずグーグル先生に聞いてみるわ。 、、Flutter公式、、英語やん、、 …