A common pattern in Mobile Apps is to have a Bottom Sheet / Slide Up Panel. React Native Slack Bottom Sheet is a wrapper around Slack’s native PanModal component for iOS. import SlackBottomSheet from 'react-native-slack-bottom-sheet'; <SlackBottomSheet topOffset={100} unmountAnimation={false} initialAnimation={false} presentGlobally={false} backgroundOpacity={0} allowsDragToDismiss={false} allowsTapToDismiss={false} isHapticFeedbackEnabled={false} blocksBackgroundTouches={false} interactsWithOuterScrollView > <View style={StyleSheet.absoluteFillObject}> <ScrollView> <Lorem /> </ScrollView> </View> </SlackBottomSheet> […]
Tag Archives: react native
react-native-ble-plx – React Native Bluetooth Low Energy (BLE) library
This is React Native Bluetooth Low Energy library using RxBluetoothKit and RxAndroidBle under the hood. scanAndConnect() { this.manager = new BleManager(); // Wait for PoweredOn state this.manager.startDeviceScan(null, null, (error, device) => { if (error) { return; } // Check if it is a device you are looking for based on advertisement data // or other […]
react-native-background-fetch – Periodic background tasks for React Native Apps
Background Fetch is a very simple plugin which will awaken an app in the background about every 15 minutes, providing a short period of background running-time. This plugin will execute your provided callbackFn whenever a background-fetch event occurs. import BackgroundFetch from "react-native-background-fetch"; export default class App extends Component { componentDidMount() { // Configure it. BackgroundFetch.configure({ […]
React Native CLI 3.1.0 and 4.0.0 – What’s New?
Mike Grabowski on the recent changes in React Native CLI: In this short article, I want to give you an overview of what’s new and what’s coming up in React Native CLI. Also, I’ll tell how do we plan our work going forward on it. The fact that React Native now shares the build cache […]
React Native + SwiftUI
Kureev Alexey on how to use SwiftUI Components in an React Native App. Today, we’ll write a proxy that allows developers to use SwiftUI in their React Native applications. The Native SwiftUI Button Component looks like this: struct SwiftUIButton : View { @ObservedObject var props = ButtonProps() var body: some View { VStack { Text("Count […]
React Native is the Future of Mobile at Shopify
Until now, the standard for all mobile development at Shopify was native mobile development. We built mobile tooling and foundations teams focused on iOS and Android helping accelerate our development efforts. While these teams and the resulting applications were all successful, there was a suspicion that we could be more effective as a team if […]
Securing React Native Applications
In this article, we will focus on the security side of the framework. We will be dividing the article into the following sections: Securing app to server connection Securing local data Advanced integrity checks Securing React Native Applications →
react-native-v8 – Opt-in V8 runtime for React Native Android
The aim of this project is to support V8 runtime for React Native. Designed as opt-in package, it should easy to integrate with existing React Native projects. After installing it, you’ll need to adjust your build.gradle files so that it includes the new runtime — a/android/app/build.gradle +++ b/android/app/build.gradle @@ -161,11 +161,18 @@ android { } […]
Easily use SVG files in React Native with react-native-svg-transformer
React Native SVG transformer allows you to import SVG files in your React Native project the same way that you would in a Web application when using a library like SVGR to transform your imported SVG images into React components. This makes it possible to use the same code for React Native and Web. Oh, […]
React Navigation 5.0 alpha – Rethinking Navigation as a Component-first API
Just announced at React Native EU is an alpha release of React Navigation 5.0, a navigator for use with React Native. An exploration of a component-first API for React Navigation for building more dynamic navigation solutions. Should play well with static type system Navigation state should be contained in root component (helpful for stuff such […]