android - estilos - react native text

¿Cómo acceder a la actividad desde un módulo React Native Native?

Question

Estoy intentando superar la funcionalidad de Android de mantener la pantalla en React Native. Pensé que podría hacer esto con un módulo simple, sin embargo no sé cómo obtener acceso a la Actividad de Android actual desde dicho módulo.

Necesito la Referencia de actividad para poder llamar a .getWindow().addFlags(WindowManager.LayoutParams.FLAG_KEEP_SCREEN_ON); en eso

Intenté obtener la actividad a través de la conversión como tal ((Activity)getReactApplicationContext().getBaseContext()) , pero esto arroja un error "no se puede convertir a Android.app.Activity"

Answer 1

¿Cómo se pasa la actividad a un paquete desde ReactApplication :: getPackages ()?

No entiendo. No encuentro ejemplos claros.

package com.bluetoothioexample;

import android.app.Application;
import android.util.Log;

import com.facebook.react.bridge.ReactContextBaseJavaModule;

import com.facebook.react.ReactApplication;
import com.facebook.react.ReactInstanceManager;
import com.facebook.react.ReactNativeHost;
import com.facebook.react.ReactPackage;
import com.facebook.react.shell.MainReactPackage;

import java.util.Arrays;
import java.util.List;

import com.subsite.bluetoothio.BluetoothIOPackage;
import com.oblador.vectoricons.VectorIconsPackage;

public class MainApplication extends Application implements ReactApplication {

  private final ReactNativeHost mReactNativeHost = new ReactNativeHost(this) {
    @Override
    protected boolean getUseDeveloperSupport() {
      return BuildConfig.DEBUG;
    }

    @Override
    protected List<ReactPackage> getPackages() {
      return Arrays.<ReactPackage>asList(
          new MainReactPackage(),
          new BluetoothIOPackage(this), //<- How pass the activity
                                        // from ReactApplication ?
          new VectorIconsPackage()
      );
    }
  };

  @Override
  public ReactNativeHost getReactNativeHost() {
      return mReactNativeHost;
  }
}

Respuesta: NO pasa la actividad de MainApplication al paquete.

Llamas a getCurrentActivity () desde tu ReactContextBaseJavaModule

Answer 2

Editado:

El problema es que getReactApplicationContext () devuelve el contexto de la aplicación y no la actividad. No puede encasillar un contexto de Aplicación a una Actividad.

Esta es una solución simple

Como generalmente, solo hay una actividad (Actividad principal) en reactivo nativo, podemos escribir una función estática en MainActivity para devolver la actividad

private static Activity mCurrentActivity = null;

protected void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    mCurrentActivity = this;
    ...
}
...
public static Activity getActivity(){
    Activity activity = new Activity();
    activity = mCurrentActivity;
    return activity;
}

luego llame a MainActivity.getActivity() desde los módulos de puente

Answer 3

Necesitaba modificar un módulo obsoleto ( react-android-360-video ) y encontré esto útil ...

En android/app/src/main/java/com/webcdpmobiledemo/MainApplication.java , usé el nuevo formato para agregar un paquete:

...
import com.vrvideocomponent.VrVideoViewPackage;

public class MainApplication extends Application implements ReactApplication {

    ...

    private final ReactNativeHost mReactNativeHost = new ReactNativeHost(this) {
      ...

      @Override
      protected List<ReactPackage> getPackages() {
        return Arrays.<ReactPackage>asList(
            new MainReactPackage(),
            new VrVideoViewPackage()
        );
      }

      ...
    };

    ...
}

Y android/app/src/main/java/com/webcdpmobiledemo/MainActivity.java está esencialmente vacío:

package com.yourproject;

import com.facebook.react.ReactActivity;

public class MainActivity extends ReactActivity {

    /**
     * Returns the name of the main component registered from JavaScript.
     * This is used to schedule rendering of the component.
     */
    @Override
    protected String getMainComponentName() {
        return "YourProject";
    }
}

Luego, modifiqué el archivo VrVideoViewPackage, que necesita pasar el reactContext al VrVideoViewManager que llama:

...

public class VrVideoViewPackage implements ReactPackage {
    ...

    @Override
    public List<ViewManager> createViewManagers(ReactApplicationContext reactContext) {
        return Arrays.<ViewManager>asList(
                new VrVideoViewManager(reactContext)
        );
    }

}

Y finalmente, en el VrVideoViewManager se puede acceder a la actividad así:

...

import android.app.Activity;
import com.facebook.react.uimanager.ThemedReactContext;
import com.facebook.react.bridge.ReactContext;

...

public class VrVideoViewManager extends SimpleViewManager<VrVideoView> {
    ...

    public VrVideoViewManager(ReactContext reactContext) {
        // Do not store mActivity, always getCurrentActivity when needed
        Activity mActivity = mContext.getCurrentActivity();
    }

    @Override
    protected VrVideoView createViewInstance(ThemedReactContext reactContext) {

        // You can also activity from ThemedReactContext
        Activity mActivity = reactContext.getCurrentActivity();

        VrVideoView vrView = new VrVideoView(mActivity);
        vrView.setEventListener(new ActivityEventListener(vrView));
        vrView.pauseVideo();
        return new VrVideoView(mActivity);
    }

    ...
}

Answer 4

No está muy claro en https://github.com/facebook/react-native/blob/master/docs/NativeModulesAndroid.md , pero puede leer el código fuente de ToastModule en la distribución nativa de reacción para ver cómo lo hacen. github.com/facebook/react-native/blob/daba14264c9f0d29c0327440df25d81c2f58316c/ReactAndroid/src/main/java/com/facebook/react/modules/toast/ToastModule.java#L31-L33

La idea es que la actividad principal se pase como reactContext en el inicializador para el módulo llamado desde ReactInstanceManager.builder () call en github.com/facebook/react-native/blob/3b4845f93c296ed93c348733809845d587227823/local-cli/generator templates / package / MainActivity.java # L28 a través de la creación de instancias de MainReactPackage github.com/facebook/react-native/blob/daba14264c9f0d29c0327440df25d81c2f58 / las partes de las personas / las personas que se encuentran en el país de los Estados Unidos.

Answer 5

Para 0.28 y anteriores, puede obtener actividad de la actividad private @Nullable Activity mCurrentActivity; , ReactContextBaseJavaModule de ReactContextBaseJavaModule usando el mismo campo.

Answer 6

Supongo que el método getCurrentActivity() de ReactContextBaseJavaModule podría usarse como el siguiente código que se ha copiado del código original React-Native ;

import android.app.Activity;
import com.facebook.react.bridge.ReactContextBaseJavaModule;

public class AwesomeModule extends ReactContextBaseJavaModule {

  public AwesomeModule(ReactApplicationContext reactContext) {
    super(reactContext);
  }

  @Override
  public String getName() {
    return "AwesomeAndroid";
  }

  private static final String ERROR_NO_ACTIVITY = "E_NO_ACTIVITY";
  private static final String ERROR_NO_ACTIVITY_MESSAGE = "Tried to do the something while not attached to an Activity";

  @ReactMethod
  public void doSomething(successCallback, errorCallback) {

    final Activity activity = getCurrentActivity();

    if (activity == null) {
      errorCallback(ERROR_NO_ACTIVITY, ERROR_NO_ACTIVITY_MESSAGE);
      return;
    }

  }

}

Answer 7

CustomReactPackage.java :

public class CustomReactPackage implements ReactPackage {

    private Activity mActivity = null;

    public CustomReactPackage(Activity activity) {
        mActivity = activity;
    }

    @Override
    public List<NativeModule> createNativeModules(ReactApplicationContext reactContext) {
        List<NativeModule> modules = new ArrayList<>();
        // Add native modules here
        return modules;
    }

    public List<Class<? extends JavaScriptModule>> createJSModules() {
        return Collections.emptyList();
    }

    public List<ViewManager> createViewManagers(ReactApplicationContext reactContext) {
        List<ViewManager> modules = new ArrayList<>();
        // Add native UI components here
        modules.add(new LSPlayerManager(mActivity));
        return modules;
    }
}

LSPlayerManager es mi componente de interfaz de usuario nativo. Defino un constructor para poder pasar en la actividad:

public LSPlayerManager(Activity activity) {
    mActivity = activity;
}

Y finalmente, en MainActivity.java donde se define ReactInstanceManager , podemos pasar la actividad a nuestro paquete React personalizado:

mReactInstanceManager = ReactInstanceManager.builder()
        .setApplication(getApplication())
        .setBundleAssetName("index.android.bundle")
        .setJSMainModuleName("src/index.android")
        .addPackage(new MainReactPackage())
        .addPackage(new CustomReactPackage(this)) // <--- LIKE THIS!
        .setUseDeveloperSupport(BuildConfig.DEBUG)
        .setInitialLifecycleState(LifecycleState.RESUMED)
        .build();

ACTUALIZACION PARA REACCIONAR NATIVO

Esto ya no es cómo accedes a la actividad en un módulo nativo. Consulte https://github.com/facebook/react-native/releases/tag/v0.29.0 para obtener instrucciones de migración