How to access the Android ImageView or Drawable

[fthuin]

Hello,

How can I retrieve an ImageView or Drawable instance from a FrescoDrawee? I need to apply a ColorFilter on my FrescoDrawee but I didn't find how to do it.

When you work with a NativeScript Image, you can easily access the ImageView using .android:

const matrix: android.graphics.ColorMatrix = new android.graphics.ColorMatrix();
matrix.setSaturation(0);
const filter: android.graphics.ColorMatrixColorFilter = new android.graphics.ColorMatrixColorFilter(
            matrix
        );
img.android.setColorFilter(filter); // img is a NS Image

It's possible that I misunderstand how Fresco worsk and that it does never generate a ImageView or Drawable. If that's the case, please tell me. I saw this library but if I can avoid creating a new plugin and adding external dependencies to my project for something that I can do in 4 lines of code with NS Image, it would be nice.

EDIT: After some research, I found this: http://frescolib.org/docs/modifying-image.html would it make sense to have that inside this repo?

[VladimirAmiorkov]

Hi @fthuin ,

The FrescoDrawee that is declared inside your XML has and android property which is the SimpleDraweeView native object. That object inherits the android.widget.ImageView so any of its methods are directly accessible. I tested your code snippet and it works as expected:

<fresco:FrescoDrawee xmlns:fresco="nativescript-fresco" 
                    verticalAlignment="center"
                    loaded="onLoaded"
                    placeholderImageUri="res://ns_logo"
                    aspectRatio="1.49"
                    imageUri="https://raw.githubusercontent.com/NativeScript/nativescript-fresco/master/examples-data/dessert1.jpg"/>

import { FrescoDrawee } from "nativescript-fresco";

export function onLoaded(args) {
    let drawee = args.object as FrescoDrawee;
    if (drawee.android) {
        const matrix: android.graphics.ColorMatrix = new android.graphics.ColorMatrix();
        matrix.setSaturation(0);
        const filter: android.graphics.ColorMatrixColorFilter = new android.graphics.ColorMatrixColorFilter(
            matrix
        );
        drawee.android.setColorFilter(filter);
    }
}

Regarding the "Post-processing" functionality of the native Fresco library, yes it would be awesome if it is implemented in the wrapper and exposed from it with JS wrapper. We are always welcoming contributions and PRs and we would love to see a PR for this functionality. If you are up to the task simply created a PR and I will review, merge and release a new version of the plugin as soon as possible. I am closing this issue.