Quantcast
Channel: Active questions tagged react-native+android - Stack Overflow
Viewing all articles
Browse latest Browse all 28460

Event clicks on android CustomView controls - React Native

$
0
0

Im rendering a android layout.xml file on react native.while trying to implement events on views inside layout.xml on android.I'm not able to acheive it

my customview.xml layout.

<?xml version="1.0" encoding="utf-8"?>


<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height='40dp'
    android:orientation="horizontal">
    <TextView android:id="@+id/multipleCameraText"
        android:layout_marginTop="20dp"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Hello, Text View from Native"
        />

        <Button android:id="@+id/button1"
            android:layout_width="wrap_content"
            android:height="40dp"
            android:layout_height="wrap_content"
            android:text="Button 1"

            />
        <Button android:id="@+id/button2"
            android:layout_marginLeft="20dp"
            android:layout_height="wrap_content"
            android:layout_width="wrap_content"
            android:height="40dp"
            android:text="Button 2"

            />
</LinearLayout>

my customview.java

package com.typesproject;

import android.content.Context;
import android.widget.LinearLayout;

import com.facebook.react.bridge.Arguments;
import com.facebook.react.bridge.ReactContext;
import com.facebook.react.bridge.WritableMap;
import com.facebook.react.uimanager.events.RCTEventEmitter;


public class CustomView2 extends LinearLayout {
        private Context context;
        public CustomView2(Context context) {
            super(context);
            this.context=context;
            this.init();
        }

        public void init() {
            //modified here.
            inflate(context, R.layout.customview2, this);
        }

        public void onReceiveNativeEvent() {
            WritableMap event = Arguments.createMap();
            event.putString("message", "MyMessage");
            ReactContext reactContext = (ReactContext)getContext();
            reactContext.getJSModule(RCTEventEmitter.class).receiveEvent(
                    getId(),
                    "topChange",
                    event);
        }
    }

I want to implement button clicks on two buttons(button1 and button2) and change text inside text view(multipleCameraText).

my customViewManager.java

package com.typesproject;

import android.view.View;

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;

import javax.annotation.Nonnull;

public class CustomViewManager extends SimpleViewManager<CustomView> {

    public  static final String Custom_View="CustomView";

    @Nonnull
    @Override
    public String getName() {
        return Custom_View;
    }

    @Nonnull
    @Override
    protected CustomView createViewInstance(@Nonnull ThemedReactContext reactContext) {
        return new CustomView(reactContext);
    }
}

Please let me know how we can achieve separate events for buttons and textview.


Viewing all articles
Browse latest Browse all 28460

Trending Articles



<script src="https://jsc.adskeeper.com/r/s/rssing.com.1596347.js" async> </script>