会社行きたくなかったんです。

自由になりたくて会社辞めました

IT プログラミング

Xamarin Visual StudioでPicassoを使って画像を表示してみました。

更新日:

Picassoを使えば、画像ダウンロードやキャッシュを効率的に行ってくれるという情報があったので、Xamarin Visual Studioでサンプルアプリを作ってみました。

スポンサーリンク

 

「PiccasoTest」という名前にしました。(Picassoのスペル間違えました。。。)

まず、プロジェクト「PiccasoTest」を作成

Picassoのライブラリを追加

 

PicassoのライブラリはNugetで追加します。

ツール>Nugetパッケージマネージャー>パッケージマネージャーコンソール

「Install-Package Square.Picasso」と入力しEnterキーを押すと、
インストールされます。

いろいろインストールされていますね。

 

参照に「Square.OkHttp」、「Square. OkIO」、「Square. Picasso」が追加されました。

 

Main.axmlに、Plain Text、Button、ImageViewを追加しました。

Plain Textには、画像のURLを入力しておいて、Buttonをクリックしたら、ImageViewに画像が表示される予定です。

Main.axmlのコードは以下です。

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="vertical"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:minWidth="25px"
    android:minHeight="25px">
    <EditText
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:id="@+id/editText1"
        android:text="https://became-free.com/wp-content/uploads/2017/04/sample_0.jpg" />
    <Button
        android:text="画像表示"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:id="@+id/button1" />
    <ImageView
        android:src="@android:drawable/ic_menu_gallery"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:id="@+id/imageView1" />
</LinearLayout>

 

MainActivity.csのコードを下のように書き換えました。

using Android.App;
using Android.Widget;
using Android.OS;
using System;
using Square.Picasso;

namespace PicassoTest
{
    [Activity(Label = "PicassoTest", MainLauncher = true, Icon = "@drawable/icon")]
    public class MainActivity : Activity
    {
        protected override void OnCreate(Bundle bundle)
        {
            base.OnCreate(bundle);

            // Set our view from the "main" layout resource
            SetContentView (Resource.Layout.Main);

            EditText txtURL = FindViewById<EditText>(Resource.Id.editText1);
            Button btnDispImage = FindViewById<Button>(Resource.Id.button1);
            ImageView ivImage = FindViewById<ImageView>(Resource.Id.imageView1);

        

            btnDispImage.Click += (object sender, EventArgs e) =>
            {
                if (String.IsNullOrWhiteSpace(txtURL.Text))
                {

                }
                else
                {
                    Picasso.With(this).Load(txtURL.Text).Into(ivImage);
                }
            };



        }
    }
}

 

起動してみました。

 

画像表示ボタンをクリックします。

 

成功しました。

エミュレータだとなぜか動作しますが、実機で起動する場合、
AndroidマニフェストでINTERNETのパーミッションを設定しておく必要があります。

 

PicassoでBasic認証

画像ファイルがBasic認証の設定されているサーバーにある場合は、

JakeWharton.Picasso2OkHttp3Downloaderというライブラリを利用します。

ツール>Nugetパッケージマネージャー>パッケージマネージャーコンソールで、

「 Install-Package JakeWharton.Picasso2OkHttp3Downloader 」と入力しEnterキーを押すと、
インストールされます。

そして、MainActivity.csのコードを下のように書き換えます。

using Android.App;
using Android.Widget;
using Android.OS;
using System;
using Square.Picasso;
using JakeWharton.Picasso;
using Square.OkHttp3;

namespace PicassoTest
{
    [Activity(Label = "PicassoTest", MainLauncher = true, Icon = "@drawable/icon")]
    public class MainActivity : Activity
    {
        protected override void OnCreate(Bundle bundle)
        {
            base.OnCreate(bundle);

            // Set our view from the "main" layout resource
            SetContentView (Resource.Layout.Main);

            EditText txtURL = FindViewById<EditText>(Resource.Id.editText1);
            Button btnDispImage = FindViewById<Button>(Resource.Id.button1);
            ImageView ivImage = FindViewById<ImageView>(Resource.Id.imageView1);

            //Basic認証のuserとpasswordを書き換えて使用してください。
            string credential = Credentials.Basic("user", "password");

            var client = new OkHttpClient.Builder()
                              .AddInterceptor(chain =>
                              {
                                  var newRequest = chain.Request()
                                              .NewBuilder()
                                              .AddHeader("Authorization", credential)
                                              .Build();
                                  return chain.Proceed(newRequest);
                              })
                .Build();

            // create the picasso handle
            var picasso = new Picasso.Builder(this)
                .Downloader(new OkHttp3Downloader(client))
                .Build();

            Picasso.SetSingletonInstance(picasso);

            btnDispImage.Click += (object sender, EventArgs e) =>
            {
                if (String.IsNullOrWhiteSpace(txtURL.Text))
                {

                }
                else
                {

                   Picasso.With(this).Load(txtURL.Text).Into(ivImage);

                }
            };

        }
    }
}

「Basic認証のuserとpasswordを書き換えて使用してください。」と書いてあるところの下の、userとpasswordを実際の値に書き換えると使用できます。

Xamarin関連書籍の検索結果はこちらです。

楽天で「Xamarin」を検索した結果

アマゾンで検索した結果

 

-IT, プログラミング

Copyright© 自由になりたくて会社辞めました , 2024 AllRights Reserved Powered by AFFINGER4.