micomia

Blog

技術記事

Textとは?|初心者向けのFlutterFlow徹底解説

Textとは?|初心者向けのFlutterFlow徹底解説

micomia株式会社の井上です。今回はTextについて解説していきます。


初心者にも分かりやすく解説していくのでぜひご一読ください。



1. Textとは

Textはそのままの意味ですが、アプリに文字を表示させるためのWidgetです。



画面名や投稿の本文など、基本的な箇所で役割を果たしています。




2. Textの実装方法


Textも他のWidgetと同じように実装できます。




image



3. Textの詳細設定


右側のProperties Panelを見ていきます。


まずはPaddingです。好きな値を設定してこのように余白を入れることができます。




image



その下のText Propertiesはテキスト自体に関する設定をすることができます。




image



Theme Text Styleはテキストのスタイルを設定することができます。




image



その下のFont FamilyはTextのフォントを設定することができます。




image



日本語の場合はIBM Plex Sans JPを使うことが多いです。このフォントを使うと漢字が変に表示されにくく使いやすいです。




image



Font Wightは文字の太さを設定することができます。100~900の太さがあるのでさまざまな太さにすることができます。




image



その下のFont Sizeで文字の大きさを設定することができます。


Text Colorは文字の色を設定できます。




image



下に一覧表示されているカラーはTheme Colorと言ってあらかじめセットされているカラーが表示されますが、好きなカラーにしたいときは上部のカラーパレットの部分で選択することができます。


Text Alignはテキストの右寄せ、左寄せなどを設定できます。これは2行以上になるときに使用する機能になります。




image



隣にあるMax Linesは、たとえば2行にした場合は2行までしか表示されなくなります。




4. さいごに


今回はTextについて解説していきました。Textはほとんどのアプリで必要な要素なので、ぜひ本記事を参考にして実装してみてください。


本記事の内容を動画で見たい方は以下をご覧ください。





image


動画でもっと知りたい方はこちら


井上花琳

micomia株式会社でプロジェクトマネージャーを担当しています。 FlutterFlowを活用したアプリ開発プロジェクトを複数統括し、そのノウハウを発信しています。

関連記事

APIとは?仕組み・種類・活用事例をわかりやすく解説|アプリ開発での重要性

APIとは?仕組み・種類・活用事例をわかりやすく解説|アプリ開発での重要性

APIとは何かを初心者向けにわかりやすく解説。仕組みやREST・GraphQLなどの種類、ビジネスでの活用例まで詳しく紹介します。

アプリ内課金(IAP)とは?仕組み・種類・導入方法をわかりやすく解説

アプリ内課金(IAP)とは?仕組み・種類・導入方法をわかりやすく解説

アプリ内課金(IAP)とは、アプリ内でコンテンツや機能を購入できる仕組みです。種類や実装方法、ビジネス活用をわかりやすく解説します。

仕様書とは?アプリ・システム開発における役割・種類・作り方をわかりやすく解説

仕様書とは?アプリ・システム開発における役割・種類・作り方をわかりやすく解説

仕様書とは何かを初心者向けにわかりやすく解説。役割や種類、作り方、開発プロジェクトでの重要性まで詳しく紹介します。

SaaSとは?仕組み・メリット・代表的なサービス例をわかりやすく解説

SaaSとは?仕組み・メリット・代表的なサービス例をわかりやすく解説

SaaSとは何かを初心者向けにわかりやすく解説。仕組みやメリット・デメリット、代表的なサービス例、ビジネスでの活用方法まで詳しく紹介します。

WebRTCとは?仕組み・活用事例・リアルタイム通信の実装をわかりやすく解説

WebRTCとは?仕組み・活用事例・リアルタイム通信の実装をわかりやすく解説

WebRTCとは、ブラウザ間でリアルタイムに音声・映像・データを直接やり取りできる技術です。仕組みやビジネス活用をわかりやすく解説します。

TypeScriptとは?特徴・JavaScriptとの違い・開発での活用をわかりやすく解説

TypeScriptとは?特徴・JavaScriptとの違い・開発での活用をわかりやすく解説

TypeScriptとは、JavaScriptに静的型付けを追加したプログラミング言語です。特徴やメリット、ビジネス活用をわかりやすく解説します。

受託開発とパッケージ開発の違いとは?特徴・費用・選び方をわかりやすく解説

受託開発とパッケージ開発の違いとは?特徴・費用・選び方をわかりやすく解説

受託開発とパッケージ開発の違いを費用・期間・柔軟性の観点で比較。自社に最適な開発手法の選び方と、ノーコード活用の第3の選択肢を解説します。

UI/UXデザインとは?違い・重要性・アプリ開発での実践方法を解説

UI/UXデザインとは?違い・重要性・アプリ開発での実践方法を解説

UI/UXデザインの違いや重要性、デザインプロセスを初心者向けにわかりやすく解説。アプリ開発における実践方法やビジネスへの効果まで詳しく紹介します。

GraphQLとは?特徴・REST APIとの違い・活用方法をわかりやすく解説

GraphQLとは?特徴・REST APIとの違い・活用方法をわかりやすく解説

GraphQLとは、Facebookが開発したAPIクエリ言語です。REST APIとの違いや仕組み、ビジネス活用までわかりやすく解説します。

ASO(App Store最適化)とは?基本施策・効果・アプリ集客力を高める方法をわかりやすく解説

ASO(App Store最適化)とは?基本施策・効果・アプリ集客力を高める方法をわかりやすく解説

ASO(App Store最適化)とは、アプリストアでの検索順位を向上させダウンロード数を増やす施策です。進め方やビジネス活用をわかりやすく解説します。

MVCアーキテクチャとは?仕組み・メリット・他パターンとの違いをわかりやすく解説

MVCアーキテクチャとは?仕組み・メリット・他パターンとの違いをわかりやすく解説

MVCアーキテクチャとは、アプリをModel・View・Controllerの3つに分離する設計パターンです。仕組みや活用方法をわかりやすく解説します。

Flutterとは?特徴・メリット・クロスプラットフォーム開発での活用をわかりやすく解説

Flutterとは?特徴・メリット・クロスプラットフォーム開発での活用をわかりやすく解説

Flutterとは、Googleが開発したクロスプラットフォーム対応のUIフレームワークです。1つのコードベースでiOS・Android・Web向けアプリを開発できる仕組みやビジネス活用について初心者にもわかりやすく解説します。

CDN(コンテンツデリバリーネットワーク)とは?仕組み・メリット・活用事例をわかりやすく解説

CDN(コンテンツデリバリーネットワーク)とは?仕組み・メリット・活用事例をわかりやすく解説

CDNとは、世界各地のサーバーからコンテンツを高速配信する仕組みです。表示速度向上やサーバー負荷軽減の仕組みをわかりやすく解説します。

SSL/TLSとは?仕組み・役割・Webサイトのセキュリティ対策をわかりやすく解説

SSL/TLSとは?仕組み・役割・Webサイトのセキュリティ対策をわかりやすく解説

SSL/TLSとは、インターネット通信を暗号化して安全にする技術です。HTTPSの仕組みやSSL証明書の役割をわかりやすく解説します。

OAuth認証とは?仕組み・フロー・安全なログイン連携の基本をわかりやすく解説

OAuth認証とは?仕組み・フロー・安全なログイン連携の基本をわかりやすく解説

OAuth認証とは、外部サービスへのアクセスを安全に許可する認可の仕組みです。ソーシャルログインの基盤技術をわかりやすく解説します。

SPA(シングルページアプリケーション)とは?仕組み・メリット・活用事例をわかりやすく解説

SPA(シングルページアプリケーション)とは?仕組み・メリット・活用事例をわかりやすく解説

SPA(シングルページアプリケーション)とは、ページ遷移なしでコンテンツを動的に切り替えるWeb設計手法です。仕組みや活用法を解説します。

キャッシュとは?仕組み・種類・パフォーマンス改善での活用をわかりやすく解説

キャッシュとは?仕組み・種類・パフォーマンス改善での活用をわかりやすく解説

キャッシュとは、データを一時保存して高速にアクセスする仕組みです。ブラウザ・サーバー・CDNでの活用法をわかりやすく解説します。

PWA(プログレッシブウェブアプリ)とは?特徴・メリット・導入方法をわかりやすく解説

PWA(プログレッシブウェブアプリ)とは?特徴・メリット・導入方法をわかりやすく解説

PWA(プログレッシブウェブアプリ)とは、Web技術でネイティブアプリのような体験を提供する技術です。仕組みやビジネス活用をわかりやすく解説します。

NoSQLデータベースとは?種類・SQLとの違い・活用事例をわかりやすく解説

NoSQLデータベースとは?種類・SQLとの違い・活用事例をわかりやすく解説

NoSQLデータベースとは、リレーショナルDB以外の柔軟なデータ管理方式の総称です。種類や仕組み、ビジネス活用までわかりやすく解説します。

BaaS(Backend as a Service)とは?仕組み・メリット・代表的なサービスをわかりやすく解説

BaaS(Backend as a Service)とは?仕組み・メリット・代表的なサービスをわかりやすく解説

BaaS(Backend as a Service)とは、バックエンド機能をクラウドで提供する仕組みです。FirebaseやSupabaseの活用法をわかりやすく解説します。