Tech

[Flutter]画像のトリミングを簡単に行えるimage_cropperを使ってみる

投稿日:

はじめに

今回は、トリミングなど画像加工を簡単に行えるimage_cropperを使ってみたいと思います。

準備

次のコマンドを使用し、パッケージをインストールします。

pubspec.yamlに以下が追加されていればOKです。

Androidで動かす場合、AndroidManifest.xmlに以下の追加が必要になります。

また、本サンプルではトリミングする画像を端末から取得するために、パッケージのimage_pickerを使用します。

こちらもpubspec.yamlに以下が追加されます。

また、image_pickerをiOSで使用する際は、端末の画像にアクセスするためNSPhotoLibraryUsageDescriptionを付与してください。

 

実装

サンプルのコードは以下になります。

 

image_cropperが画像の編集画面を用意しており、

画像の回転や

範囲を選択して切り抜きをこなうことができます。

また、切り抜く範囲の比率もある程度選択でき、例えばSquareを選択すると、切り抜き範囲が正方形になります。

さいごに

かなり簡単に使える上に、viewも用意してくれていてかなり優秀なパッケージだと思いました。プロフィールのアイコンなど画像設定するような機能を実装する際にはお供にしても良いかと思います。

おすすめ書籍

現場で使える Flutter開発入門 (Compass Booksシリーズ) はじめてのFlutter入門: iOS/Androidアプリ開発の⼀歩を踏み出そう!

blog-page_footer_336




blog-page_footer_336




-Tech
-

執筆者:

免責事項

このブログは、記事上部に記載のある投稿日時点の一般的な情報を提供するものであり、投資等の勧誘・法的・税務上の助言を提供するものではありません。仮想通貨の投資・損益計算は複雑であり、個々の取引状況や法律の変更によって異なる可能性があります。ブログに記載された情報は参考程度のものであり、特定の状況に基づいた行動の決定には専門家の助言を求めることをお勧めします。当ブログの情報に基づいた行動に関連して生じた損失やリスクについて、筆者は責任を負いかねます。最新の法律や税務情報を確認し、必要に応じて専門家に相談することをお勧めします。


comment

メールアドレスが公開されることはありません。 が付いている欄は必須項目です

CAPTCHA


関連記事

icon

ドキュメント作成の技術「テクニカルライティング」とは

1 はじめに2 テクニカルライティングとは3 少しでも分かりやすく、簡潔にする3.1 一文一義3.2 長くしすぎない、繋げすぎない3.3 長さの目安は?4 伝わりやすく書く4.1 まず主題を書く4.2 ...

祝!iOS15でハーフモーダルが追加

1 はじめに2 早速使ってみる2.1 準備2.2 実装2.3 detents2.4 コードでの高さ切り替え2.5 モーダル内のスクロール許可2.6 グラバーの表示2.7 角丸2.8 親Viewとの併用 ...

【Swift】Xcode13XCTestの新機能、繰り返し実行で遊んでみた。

1 はじめに2 XCTestについて3 繰り返しのテストについて4 実際に使ってみる5 テストコードについて6 テストの設定7 さいごに8 おすすめ書籍 はじめに こんにちは、suzukiです。とうと ...

Bluetooth Low Energy(BLE)とは? Bluetoothの開発が初めての人向け!

1 はじめに2 Bluetoothの規格2.1 Bluetooth Classic2.2 BLE(Bluetooth Low Energy)3 BLEの役割4 サービスとキャラクタリスティック4.1 ...

Flutterで写真撮影しよう!

1 はじめに2 準備3 実装3.1 プレビューの表示3.2 写真を撮る4 さいごに5 おすすめ書籍 はじめに 今回はFlutterでカメラを使用して、プレビューの表示と写真の撮影を行いたいと思います。 ...

フォロー

blog-page_side_responsive

2022年4月
 12
3456789
10111213141516
17181920212223
24252627282930

アプリ情報

私たちは無料アプリもリリースしています、ぜひご覧ください。 下記のアイコンから無料でダウンロードできます。