ReactImageView set Bitmap source - android

I have a rather strange situation where I want to display images in React-Native coming from a native library in bitmap form. In order to get the Bitmap object that needs to be rendered, the component needs to make use of an "adId" prop.
I thus far have the following code for a native component:
import android.graphics.Bitmap;
import com.facebook.drawee.backends.pipeline.Fresco;
import com.facebook.react.uimanager.SimpleViewManager;
import com.facebook.react.uimanager.ThemedReactContext;
import com.facebook.react.uimanager.annotations.ReactProp;
import com.facebook.react.views.image.ReactImageView;
public class AdIconViewManager extends SimpleViewManager<ReactImageView> {
public static final String REACT_CLASS = "RCTAdIconView";
#Override
public String getName() {
return REACT_CLASS;
}
#Override
public ReactImageView createViewInstance(ThemedReactContext context) {
return new ReactImageView(context, Fresco.newDraweeControllerBuilder(), null, null);
}
#ReactProp(name = "adId")
public void setAdId(ReactImageView view, String adId) {
final Bitmap icon = AppodealModule.getIcon(adId);
// What now?
}
}
My problem is that I cannot figure out how to set the bitmap source of the ReactImageView. ReactImageView is completely undocumented but seems to use Fresco (which I don't know at all). Is there some way I can use some other DraweeControllerBuilder to provide Bitmaps?

Fresco manages the bitmap cache itself thus it might be more convenient to use getIconUrl and set an URL instead of bitmap, using this guide - http://frescolib.org/docs/using-simpledraweeview.html
If you want to use bitmap itself these docs can give you a vision of the fresco pipeline - http://frescolib.org/docs/using-image-pipeline.html

Related

Using native Android view in ReactNative: Constructor ReactImageView in class ReactImageView cannot be applied to given types

Attempting to create an Android view to use in ReactNative later on.
This is the code that I wrote following the official tutorial, but I'm still getting some troubles compiling.
Here is the error message that I get:
Error:(15, 53) error: constructor ReactImageView in class ReactImageView cannot be applied to given types;
required: Context,AbstractDraweeControllerBuilder,GlobalImageLoadListener,Object
found: no arguments
reason: actual and formal argument lists differ in length
Here instead is the code:
package com.androidbridge;
import com.facebook.react.uimanager.SimpleViewManager;
import com.facebook.react.views.image.ReactImageView;
import com.facebook.react.uimanager.ThemedReactContext;
import com.facebook.drawee.backends.pipeline.Fresco;
import javax.annotation.Nullable;
public class ReactImageManager extends SimpleViewManager<ReactImageView> {
public static final String REACT_CLASS = "RCTImageView";
private Object mCallerContext;
public ReactImageManager(Object mCallerContext) {
this.mCallerContext = mCallerContext;
}
#Override
public String getName() {
return REACT_CLASS;
}
#Override
protected ReactImageView createViewInstance(ThemedReactContext reactContext) {
return new ReactImageView(reactContext, Fresco.newDraweeControllerBuilder(), mCallerContext);
}
}
I am kind of lost as the code is derived from the official tutorial.
It seems like the signature of the class ReactImageView has changed since the tutorial was written, the constructor now also require you to pass an object of type GlobalImageLoadListener. It is marked as nullable as of the latest react-native version, so you can try just passing a null reference.
I just got started myself and find the tutorial somewhat lacking.

Android fresco lib , apply custom filter

i'm using fresco to display images to my app. Right now i'm trying to apply some filters to my images but the problem is that the filter library only results Bitmap. But the draweeView.setImageBitmap is deprecated.
I also tried with a post processor like this
MeshPostprocessor meshPostprocessor = new MeshPostprocessor();
meshPostprocessor.setFilter(filters.get(0));
draweeView = (SimpleDraweeView) view.findViewById(R.id.filter_image);
ImageRequest request = ImageRequestBuilder.newBuilderWithSource(image)
.setPostprocessor(meshPostprocessor)
.setResizeOptions(new ResizeOptions(100, 100))
.build();
PipelineDraweeController controller = (PipelineDraweeController)
Fresco.newDraweeControllerBuilder()
.setImageRequest(request)
.setOldController(draweeView.getController())
.build();
draweeView.setController(controller);
and here is the PostProcessor
public static class MeshPostprocessor extends BaseRepeatedPostProcessor {
private AbstractConfig.ImageFilterInterface filter;
public void setFilter(AbstractConfig.ImageFilterInterface filter) {
this.filter = filter;
update();
}
#Override
public String getName() {
return "meshPostprocessor";
}
#Override
public void process(Bitmap bitmap) {
bitmap = filter.renderImage(bitmap);
}
}
so when I click on a filter i just run this
meshPostprocessor.setFilter(colorFilterConfig.get(position));
I tried with the debugger, the code goes through all the methods (setFilter , process etc..) but the image is not changing at all...
What am i missing?
I think you don't need a BaseRepeatedPostProcessor in your case.
A normal BasePostProcessor should be sufficient here.
However, the issue seems to be your custom filter:
#Override
public void process(Bitmap bitmap) {
bitmap = filter.renderImage(bitmap);
}
I suppose it returns a different Bitmap? This does not work in Java / for Fresco.
If your filter can do the processing in place, you can use process(Bitmap bitmap) and directly modify the given bitmap (e.g. bitmap.setPixel(...)).
If you cannot do it in place, you can override process(Bitmap destBitmap, Bitmap sourceBitmap) instead and modify destBitmap.
If your bitmap changes it's size, you can override CloseableReference<Bitmap> process(Bitmap sourceBitmap, PlatformBitmapFactory bitmapFactory). However, in this case make sure to actually use the provided bitmapFactory to create the new bitmap to be efficient.
For more information, take a look at http://frescolib.org/docs/modifying-image.html for more information or check out the JavaDoc for BasePostprocessor.
ok so the way I solved this is by adding a super call on the process like this
#Override
public void process(Bitmap dest, Bitmap source) {
Bitmap filtered = filter.renderImage(source, intensity);
super.process(dest, filtered);
}
i didn't noticed that you have to call super in order for the changes to have effect.

How to add a splash image to an adobe air for android application?

I need to add a preloader / splash screen to an Adobe Air application that I am building in IntelliJ Idea using pure Actionscript.
I have found many solutions, but they all assume a flex application. I am using the flex compiler, but the project is not written in flex so there are no mxml tags in order to use SparkMobileSplashScreen.mxml
Can a splash screen image be added to the air application xml file somehow?
Here's a basic setup for an embedded preloader. Your Document Class should look like this:
package {
import flash.display.Sprite;
[Frame(factoryClass='Preloader')] //class name of your preloader
public class Main extends Sprite {
public function Main() {
//init
}
}
}
Preloader Class:
package {
import flash.display.DisplayObject;
import flash.display.MovieClip;
import flash.events.ProgressEvent;
import flash.utils.getDefinitionByName;
public class Preloader extends MovieClip {
public function Preloader()
{
//add preloader graphics
//check loading progress
this.loaderInfo.addEventListener(ProgressEvent.PROGRESS, onProgress);
}
private function onProgress(e:ProgressEvent):void
{
var percent:Number = Math.round(e.bytesLoaded / e.bytesTotal * 100);
if (percent == 100)
{
this.loaderInfo.removeEventListener(ProgressEvent.PROGRESS, onProgress);
onLoaded();
}
}
private function onLoaded():void
{
nextFrame(); //go to next frame
var App:Class = getDefinitionByName("Main") as Class; //class of your app
addChild(new App() as DisplayObject);
}
}
}

React Native Android Native UI Components doesn't find #ReactProps

i'm trying to implement my first react native UI component, i followed the Facebook tutorial and it should be easy but i have some strange problem
public class CameraViewManager extends SimpleViewManager<CameraPreview> {
public static final String REACT_CLASS = "RCTCameraView";
#Override
public String getName() {
return REACT_CLASS;
}
#Override
public CameraPreview createViewInstance(ThemedReactContext context) {
return new CameraPreview(context);
}
#ReactProp(name = "test")
public void setTest(CameraPreview view, #Nullable String test){
Log.i("TESTWD", test);
}
}
This is the ViewManager i'm using and to me it seems correct. The first problem is that android studio doesn't find #ReactProp and it doesn't compile. The second problem is that if i remove that method everything compile but when i use this component nothing appears
Just ran into this myself. The solution is as if-else-switch pointed out in a comment above:
// Import this
import com.facebook.react.uimanager.annotations.ReactProp;
// Not this!
import com.facebook.react.uimanager.ReactProp;
There seem to be two #ReactProp definitions in different packages and Android Studio chooses the wrong one by default.
I solved this problem using react-native 0.13.+ instead of 0.11.+

Keeping a session in all application life

I need to create a session and change it at times. In a specific activity should recover it and compare it to a different variable and modify the value of this session. I tried to create a class for this, but the change of activity, the value back to null. I need it to remain until the application is closed.
below:
import android.app.Application;
public class Util extends Application {
private static String idCorrente;
public void onCreate() {
super.onCreate();
idCorrente="0";
}
public static String getIdCorrente() {
return idCorrente;
}
public static void setIdCorrente(String id) {
Util.idCorrente = id;
}
}
I do not know exactly the right way to do it.
You need to store the data on the device somehow. I would recommend reading the Storage Options page of the Android Developers Guide.
Specifically, I think you will find SharedPreferences well-suited for your application.

Categories

Resources