今回はPicassoを試してみたいと思います。
画像のダウンロード先はDocker+Rackで画像サーバーを作成(ただやりたいだけ)
画像のダウンロード先はDocker+Rackで画像サーバーを作成(ただやりたいだけ)
Picassoとは?
Androidで画像のダウンロードやキャッシュをいい感じにやってくれるライブラリ
画像サーバー
わざわざDocker+Rackで作成しなくてもいいとは思いますが、、💦
試しにやってみました。
試しにやってみました。
- Dockerfile
FROM ruby:2.3.0 ENV LANG C.UTF-8 ENV HOME_DIR /usr/src/app WORKDIR $HOME_DIR RUN apt-get update -qq COPY Gemfile $HOME_DIR/ RUN bundle install ADD . $HOME_DIR
- Gemfile
source 'https://rubygems.org' gem 'rack'
docker-cpmpose
も使ってみます。- docker-cpmpose.yml
version: '2' services: web: build: . command: rackup -p 9292 -o 0.0.0.0 environment: RAILS_ENV: development ports: - '9292:9292' volumes: - .:/usr/src/app
- config.ru
# encoding: utf-8 run Rack::Directory.new(File.dirname(__FILE__) + "/public")
public配下をhttp://localhost:9292/
でアクセスできるように公開してます。
画像はDockerfileと同じディレクトリ内に以下パスで画像を置きました
public/images/sample.jpg
早速実行✨
$ docker-cpmpose up -d
ブラウザで
http://localhost:9292/images/sample.jpg
にアクセスし画像が表示されたら成功です。
停止は
docker-compose stop
Androidアプリ作成
ようやくのアプリ作成です💧
まずはプロジェクトの
build.gradle
に以下を追加android {
・・・
dataBinding {
enabled = true
}
}
dependencies {
・・・
compile 'com.squareup.picasso:picasso:2.5.2'
}
ついでにdatabindingも有効にしときます。
次にレイアウトファイルの修正
<?xml version="1.0" encoding="utf-8"?>
<layout xmlns:android="http://schemas.android.com/apk/res/android" >
<RelativeLayout
・・・ >
<Button
android:id="@+id/button"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Button"
android:layout_alignParentBottom="true"
android:layout_alignParentEnd="true" />
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentStart="true"
android:id="@+id/imageView"
android:layout_above="@+id/button"
android:layout_alignParentEnd="true"
android:layout_alignParentTop="true" />
</RelativeLayout>
</layout>
そしてActivity内でボタンが押されたら「画像をダウンロードしてImageViewに設定する」
という処理を実装して行きます。
という処理を実装して行きます。
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
mBinding = DataBindingUtil.setContentView(this, R.layout.activity_main);
Button button = mBinding.button;
button.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View v) {
ImageView imageView = mBinding.imageView;
Picasso.with(MainActivity.this)
.load("http://xxxx/images/sample.jpg")
.into(imageView);
}
});
}
↓実際にPicassoを使っている所ですがメソッドチェーンで分かり易いです✨
Picasso.with(MainActivity.this)
.load("http://xxxx/images/sample.jpg")
.into(imageView);
※ 自分の環境では
以前使ったngrokを使ってlocalhostを外部公開して使ってます。
Docker for Mac
+ Android Emulator
で動作させようとしたらEmulatorが動作しなかったので以前使ったngrokを使ってlocalhostを外部公開して使ってます。
- 動作
画像は宮島の鹿ですw
Picassoではその他
リサイズ
や回転
等色々できるようです。Picasso.with(MainActivity.this)
.load("http://xxxx/images/sample.jpg")
.resize(50, 50) // リサイズ
.rotate(90.0f) // 回転
.error(R.drawable.hoge) // エラー時の画像
.into(imageView);
0 件のコメント:
コメントを投稿