کتاب خانه Fresco برای لود عکس در اندروید

امتیاز 5.00 ( 1 رای )

سلام دوستان در این سری از آموزش برنامه نویسی اندروید به آموزش کتاب خانه Fresco برای لود عکس در اندروید می پردازیم از این کتاب خانه می توان به منظور بارگذاری (Load) عکس در ImageView در اندروید مورد استفاده قرار می گیرد این کتاب خانه در اپلیکیشن FaceBook نیز استفاده می شود و به گونه ای خود FaceBook منتشر کننده این کتاب خانه است.

از ویژگی های این کتاب خانه می توان به موارد زیر اشاره کرد :

Caching پیشرفته (امکان فعال یا غیر فعال کردن این ویژگی)
امکان کشیدن یا Draw بروی عکس
پشتیبانی از لود فایل به صورت local , سرور , drawable و content provider

ابتدا وارد فایل Build.gradle از نوع Module شده سپس در بخش dependencies خط زیر را اضافه کنید.

    implementation 'com.facebook.fresco:fresco:0.6.1'

1	implementation 'com.facebook.fresco:fresco:0.6.1'

پروژه را sync کنید قند شکن رو حتما روشن کنید.
وارد فایل AndroidManifest.xml شده سپس دسترسی زیر را اضافه کنید.

<uses-permission android:name="android.permission.INTERNET"/>

1	<uses-permission android:name="android.permission.INTERNET"/>

دسترسی بالا دسترسی مربوط به اینترنت است.
بعد از اینکار وارد اکتیویتی که می خواهید عکس ها لود شود شده باید کتاب خانه را initialise کنید
قبل از setContentView خط زیر را قرار دهید.

Fresco.initialize(context);

1	Fresco.initialize(context);

وارد layout خود شده و view زیر را قرار دهید.

<com.facebook.drawee.view.SimpleDraweeView
    android:id="@+id/my_image_view"
    android:layout_width="20dp"
    android:layout_height="20dp"
    fresco:actualImageScaleType="focusCrop"
    fresco:placeholderImage="@color/wait_color"
    fresco:placeholderImageScaleType="fitCenter"
    fresco:failureImage="@drawable/error"
    fresco:failureImageScaleType="centerInside"
    fresco:roundAsCircle="false"
    fresco:roundedCornerRadius="1dp"
    fresco:roundTopLeft="true"
    fresco:roundTopRight="false"
    fresco:roundBottomLeft="false"
    fresco:roundBottomRight="true"
    fresco:roundWithOverlayColor="@color/corner_color"
    fresco:roundingBorderWidth="2dp"
    fresco:roundingBorderColor="@color/border_color" />

<com.facebook.drawee.view.SimpleDraweeView

android:id="@+id/my_image_view"

android:layout_width="20dp"

android:layout_height="20dp"

fresco:actualImageScaleType="focusCrop"

fresco:placeholderImage="@color/wait_color"

fresco:placeholderImageScaleType="fitCenter"

fresco:failureImage="@drawable/error"

fresco:failureImageScaleType="centerInside"

fresco:roundAsCircle="false"

fresco:roundedCornerRadius="1dp"

fresco:roundTopLeft="true"

fresco:roundTopRight="false"

fresco:roundBottomLeft="false"

fresco:roundBottomRight="true"

fresco:roundWithOverlayColor="@color/corner_color"

fresco:roundingBorderWidth="2dp"

fresco:roundingBorderColor="@color/border_color" />

در ادامه ویژگی های بالا یکی یکی بررسی می کنیم.
fresco:fadeDuration : به منظور
fresco:placeholderImage : قبل از لود شدن عکس اگر بخواهید view خالی نباشد می توانید یک placeholder برای آن قرار دهید.
fresco:placeholderImageScaleType : تعیین مقایس لود عکس placeholder.
fresco:roundedCornerRadius=”5dp” : اگر بخواهید عکس گرد شود اندازه را به این ویژگی بدید این اندازه میزان گردی را تعیین می کند.
fresco:roundWithOverlayColor=”@color/blue” : برای اینکه رنک گردی دایره را مشخص کنید مورد استفاده قرار می گیرد.
fresco:roundAsCircle : به منظور گردن کردن استفاده می شود.
fresco:actualImageScaleType : مقیاس نمایش عکس را تعیین می کند.
fresco:failureImage : در صورتی که عکس لود نشود می توانید یک عکس برای آن در نظر بگیرید.
fresco:failureImageScaleType : تعیین مقایس عکس لود نشده .

برای لود کردن عکس از اینترنت یا سرور می توانید مثل زیر عمل کنید.

Uri uri = Uri.parse("https://raw.githubusercontent.com/facebook/fresco/master/docs/static/logo.png");
SimpleDraweeView draweeView = (SimpleDraweeView) findViewById(R.id.my_image_view);
draweeView.setImageURI(uri);

Uri uri = Uri.parse("https://raw.githubusercontent.com/facebook/fresco/master/docs/static/logo.png");

SimpleDraweeView draweeView = (SimpleDraweeView) findViewById(R.id.my_image_view);

draweeView.setImageURI(uri);

عکس بالا برای شما لود نمی شود چون github ایران را تحریم کرده از عکس دیگری استفاده کنید !
برای اینکه با استفاده از کد PlaceHolder را تنظیم کنید می توانید مثل زیر عمل کنید.

mSimpleDraweeView.getHierarchy().setPlaceholderImage(placeholderImage);

1	mSimpleDraweeView.getHierarchy().setPlaceholderImage(placeholderImage);

برای اینکه با استفاده از کد عکس خطا را تنظیم کنید از کد زیر استفاده کنید.

mSimpleDraweeView.getHierarchy().setFailureImage(failureImage);

1	mSimpleDraweeView.getHierarchy().setFailureImage(failureImage);

لینک هایی که توسط این کتاب خانه پشتیبانی می شود در جدول زیر ذکر شده است.

نوع	SCHEME	متد های پشتیبانی شده
File on network	`http://,` `https://`	`HttpURLConnection` or network layer
File on device	`file://`	`FileInputStream`
Content provider	`content://`	`ContentResolver`
Asset in app	`asset://`	`AssetManager`
Resource in app	`res://` as in `res:///12345`	`Resources.openRawResource`
Data in URI	`data:mime/type;base64,`	Following data URI spec (UTF-8 only)

برای اینکه عکس Base64 را لود کنید می توانید مثل زیر عمل کنید.

 String dataUri =
      "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAGUAAABkCAIAAAAQQmk9AAAD2ElEQVR42u2cvW/cMAzF" +
          "+T927t49c/fu3bN3zp6hQ4EbMhRIhg5BOmRIgQBN02u+2/QBAozL2WfT0pNFKRSIwPAltvwL70kkJcuztzlNHI" +
          "Hzcl7Oy3k5r3Lt+OrReWnbj9u/bz7/xE/npWofv/0BL/x0XtNt/fgPsILh2HlNtE/fbzteOHZeE8719stVxwvH" +
          "1lzMFq+D87sOVjCccV4727vVry1eOOO8htvhxf0WrGA477xUzmXQxazwWl0+DMIKhk+d14v2/uvvEV741Hm9iB" +
          "ZHYAUzElGKfecy5WLleYXoWmMWIvDyvEJ0rTELEbjU4lxGXExqcS4jLlaS11Z0rbHiEXhJXpupG72VTfJIRc5l" +
          "wcWK8doVXWusYARejNeu6FpjBSNwqc65yrqYVOdcZV2sAC9NdK2xIhF4AV6a6FpjRSJwqdS5SrnY0rw+nKyJvH" +
          "C1BnmdrZ/gCAfnd3ET+snpPq6M6+MulfFCp2F4ABjEBRY3g08x3DHcOnQjdKkkL8Qi6MHq8mGTy8JQoseHjiP6" +
          "j6eIiKtkJDPVcdk/vcGd9o6uq+Ay1/BceDo8Y8dxJMsm/ZxB+mSyDQOHfi5E+l+3Vv0owu/6X1gZVKhaJCmr2A" +
          "2qm7AyxS3ZSNZbiMn15mFNzydeG7LJesr0/Cs9V1WLaXJqqvnqa0CmTEBq5/dtI9Nna2fEQ5j7Lh8PLhBvzlpc" +
          "JnMzDS0hw7PMzWrMjrebQRYBKzKfg9vUHmOi/3H5ssj8V9Vh5mBgmD1fWCmyFFip+dXqkCXCIuSjcftaYib0M3" +
          "2hCid/bx8Za6Edrd5hGRlxVSKzPpSjXEYpuNmtP1oLM+nLePj1WjvIcqx5ylLf3j+9KQ4LfahmPYCFckmm1TtZ" +
          "eFkIyNGHOnjN3bKRz3JsBuHzGt/5uaTl2GXK52VnFpZjZ4M0Kfb5JF+aFPt8kk/mtfn2GwtG3zlD5sVdzmtwQb" +
          "C0KvaZJJ/Mi7v82eACajIva3Uj+rYZaVjsc0i+NCz2OSTf86vleLHEfu/o+vDinlWp40q+mBJ7XGEzKYpjazsl" +
          "mbwSYxd8cfrajDM4nxhjWeSVIvaTldTEqjBR8mm8+q9qVKYQ9Fk9/GZc8oP40shi9VrIedy/HX81dyiwWK/VP8" +
          "OWqEdX7fRDAfpmjleKqEeHE/qhwBYvjdhTlsdEDwUsyZcFxH6WqEcXpcaHApbk513PFC3q0W6+S0ZtrWfq95Ii" +
          "6sShgCX5HF75RJ04FFjhdbZ+yi3qlKGA8sIFofj/MqKeOBRQ9IHAK+ypf7bdwrsOzOXvm2/Oy3k5L+flvJyXt3" +
          "77Dzs5iMw8JSAYAAAAAElFTkSuQmCC";
final SimpleDraweeView simpleDraweeView =findViewById(R.id.drawee_view);
    simpleDraweeView.setImageURI(dataUri, null);

String dataUri =

"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAGUAAABkCAIAAAAQQmk9AAAD2ElEQVR42u2cvW/cMAzF" +

"+T927t49c/fu3bN3zp6hQ4EbMhRIhg5BOmRIgQBN02u+2/QBAozL2WfT0pNFKRSIwPAltvwL70kkJcuztzlNHI" +

"Hzcl7Oy3k5r3Lt+OrReWnbj9u/bz7/xE/npWofv/0BL/x0XtNt/fgPsILh2HlNtE/fbzteOHZeE8719stVxwvH" +

"1lzMFq+D87sOVjCccV4727vVry1eOOO8htvhxf0WrGA477xUzmXQxazwWl0+DMIKhk+d14v2/uvvEV741Hm9iB" +

"ZHYAUzElGKfecy5WLleYXoWmMWIvDyvEJ0rTELEbjU4lxGXExqcS4jLlaS11Z0rbHiEXhJXpupG72VTfJIRc5l" +

"wcWK8doVXWusYARejNeu6FpjBSNwqc65yrqYVOdcZV2sAC9NdK2xIhF4AV6a6FpjRSJwqdS5SrnY0rw+nKyJvH" +

"C1BnmdrZ/gCAfnd3ET+snpPq6M6+MulfFCp2F4ABjEBRY3g08x3DHcOnQjdKkkL8Qi6MHq8mGTy8JQoseHjiP6" +

"j6eIiKtkJDPVcdk/vcGd9o6uq+Ay1/BceDo8Y8dxJMsm/ZxB+mSyDQOHfi5E+l+3Vv0owu/6X1gZVKhaJCmr2A" +

"2qm7AyxS3ZSNZbiMn15mFNzydeG7LJesr0/Cs9V1WLaXJqqvnqa0CmTEBq5/dtI9Nna2fEQ5j7Lh8PLhBvzlpc" +

"JnMzDS0hw7PMzWrMjrebQRYBKzKfg9vUHmOi/3H5ssj8V9Vh5mBgmD1fWCmyFFip+dXqkCXCIuSjcftaYib0M3" +

"2hCid/bx8Za6Edrd5hGRlxVSKzPpSjXEYpuNmtP1oLM+nLePj1WjvIcqx5ylLf3j+9KQ4LfahmPYCFckmm1TtZ" +

"eFkIyNGHOnjN3bKRz3JsBuHzGt/5uaTl2GXK52VnFpZjZ4M0Kfb5JF+aFPt8kk/mtfn2GwtG3zlD5sVdzmtwQb" +

"C0KvaZJJ/Mi7v82eACajIva3Uj+rYZaVjsc0i+NCz2OSTf86vleLHEfu/o+vDinlWp40q+mBJ7XGEzKYpjazsl" +

"mbwSYxd8cfrajDM4nxhjWeSVIvaTldTEqjBR8mm8+q9qVKYQ9Fk9/GZc8oP40shi9VrIedy/HX81dyiwWK/VP8" +

"OWqEdX7fRDAfpmjleKqEeHE/qhwBYvjdhTlsdEDwUsyZcFxH6WqEcXpcaHApbk513PFC3q0W6+S0ZtrWfq95Ii" +

"6sShgCX5HF75RJ04FFjhdbZ+yi3qlKGA8sIFofj/MqKeOBRQ9IHAK+ypf7bdwrsOzOXvm2/Oy3k5L+flvJyXt3" +

"77Dzs5iMw8JSAYAAAAAElFTkSuQmCC";

final SimpleDraweeView simpleDraweeView =findViewById(R.id.drawee_view);

simpleDraweeView.setImageURI(dataUri, null);

بررسی وجود عکس در کش با استفاده از کد زیر

ImagePipeline imagePipeline = Fresco.getImagePipeline();
Uri uri;
boolean inMemoryCache = imagePipeline.isInBitmapMemoryCache(uri);

ImagePipeline imagePipeline = Fresco.getImagePipeline();

Uri uri;

boolean inMemoryCache = imagePipeline.isInBitmapMemoryCache(uri);

خالی کردن کش عکس ها با استفاده از کد زیر

ImagePipeline imagePipeline = Fresco.getImagePipeline();
imagePipeline.clearMemoryCaches();
imagePipeline.clearDiskCaches();
imagePipeline.clearCaches();

ImagePipeline imagePipeline = Fresco.getImagePipeline();

imagePipeline.clearMemoryCaches();

imagePipeline.clearDiskCaches();

imagePipeline.clearCaches();

تعیین کیفیت عکس نمایش به شکل کمترین و بیشترین resolution

Uri lowResUri, highResUri;
DraweeController controller = Fresco.newDraweeControllerBuilder()
    .setLowResImageRequest(ImageRequest.fromUri(lowResUri))
    .setImageRequest(ImageRequest.fromUri(highResUri))
    .setOldController(mSimpleDraweeView.getController())
    .build();
mSimpleDraweeView.setController(controller);

Uri lowResUri, highResUri;

DraweeController controller = Fresco.newDraweeControllerBuilder()

.setLowResImageRequest(ImageRequest.fromUri(lowResUri))

.setImageRequest(ImageRequest.fromUri(highResUri))

.setOldController(mSimpleDraweeView.getController())

.build();

mSimpleDraweeView.setController(controller);

این آموزش هم به پایان رسید.
موفق و پیروز باشید.

مطالعه بیشتر

کتاب خانه Fresco برای لود عکس در اندروید

مطالب مشابه

2 پاسخ به “کتاب خانه Fresco برای لود عکس در اندروید”

دیدگاهتان را بنویسید لغو پاسخ

مطالب مشابه

2 پاسخ به “کتاب خانه Fresco برای لود عکس در اندروید”

دیدگاهتان را بنویسید لغو پاسخ

اشتراک گذاری در شبکه های اجتماعی