[RN] "The View is never the target of touch events"

In preparation for "pinch to zoom" support in desktop streams on mobile, make
certain Views not intervene in touch event handling. While the modification is
necessary for "pinch to zoom" which is coming later, it really makes sense for
the modified Views to not be involved in touching because they're used to aid
layout and/or animations and are to behave to the user as if they're not there.

react/features/base/media/components/native/VideoTrack.js

         return (
             <View style = { styles.video } >
                 { super.render() }
-                <Animated.View style = { animatedStyles } />
+                <Animated.View
+                    pointerEvents = 'none'
+                    style = { animatedStyles } />
             </View>
         );
     }

react/features/base/participants/components/ParticipantView.native.js

         };
 
         return (
-            <View style = { containerStyle } >
-                <Text style = { styles.connectionInfoText } >
+            <View
+                pointerEvents = 'box-none'
+                style = { containerStyle }>
+                <Text style = { styles.connectionInfoText }>
                     { t(messageKey, { displayName }) }
                 </Text>
             </View>

react/features/base/react/components/native/Container.js

             return null;
         }
 
-        let element = super._render(View, props);
+        const onClickOrTouchFeedback = onClick || touchFeedback;
+        let element
+            = super._render(
+                View,
+                {
+                    pointerEvents: onClickOrTouchFeedback ? 'auto' : 'box-none',
+                    ...props
+                });
 
         // onClick & touchFeedback
-        if (element && (onClick || touchFeedback)) {
+        if (element && onClickOrTouchFeedback) {
             element
                 = React.createElement(
                     touchFeedback

react/features/base/react/components/native/TintedView.js

     render() {
         // XXX Don't tint the children, tint the background only.
         return (
-            <View style = { BASE_STYLE }>
-                <View style = { this.state.style } />
-                <View style = { BASE_STYLE }>
+            <View
+                pointerEvents = 'box-none'
+                style = { BASE_STYLE }>
+                <View
+                    pointerEvents = 'none'
+                    style = { this.state.style } />
+                <View
+                    pointerEvents = 'box-none'
+                    style = { BASE_STYLE }>
                     { this.props.children }
                 </View>
             </View>

react/features/conference/components/Conference.native.js

                         </TintedView>
                 }
 
-                <View style = { styles.toolboxAndFilmstripContainer } >
+                <View
+                    pointerEvents = 'box-none'
+                    style = { styles.toolboxAndFilmstripContainer }>
                     {/*
                       * The Toolbox is in a stacking layer bellow the Filmstrip.
                       */}

react/features/toolbox/components/Toolbox.native.js

         return (
             <View
                 key = 'primaryToolbar'
+                pointerEvents = 'box-none'
                 style = { styles.primaryToolbar }>
                 <AudioMuteButton buttonStyles = { audioButtonStyles } />
                 <HangupButton />
         return (
             <View
                 key = 'secondaryToolbar'
+                pointerEvents = 'box-none'
                 style = { styles.secondaryToolbar }>
                 {
                     AudioRouteButton