I have this screen in my React Native app: https://snack.expo.io/@gkeenley/playful-blueberries
It renders fine in that snack ^^ for web (the default emulator), but for Android the image gets a height of zero and doesn't appear.
Does anyone know how I can approach debugging this?
UPDATE
If I remove flex: 1 on the icon style, it fixes it. But I don't understand why that makes a difference and why you need to do it for Android but not web.
I am having a requirement,wherein i have a React-Native app (PrimaryApp),and having a Game-App(Secondary App) which is also developed inReact-native.
Now on a button click of Primary App I want to launch SecondaryApp,and play the game as part of Primary-App.Please let me know orguide me,How can I integrate these two separate entities and get thedone.
Is there any way,to bundle Secondary react-native app and launch in PrimaryApp?
Note :- Since i have hundreds of games it will be a bad idea to have code of all games in Primary app, so is there any way to launch each game as separate entity or in any bundle form something like that,as part of Primary App.
Thanks for your time.
I'm using this package for location tracking and using Firebase. then how to show moving direction on map like if moving west my location turns into looking west. I didn't find anything like this. It's so new thing for me.
BackgroundGeolocation.configure({ desiredAccuracy: BackgroundGeolocation.LOW_ACCURACY, stationaryRadius: 120, distanceFilter: 120, notificationTitle: 'Background tracking', notificationText: 'enabled', debug: true, startOnBoot: false, stopOnTerminate: true, locationProvider: BackgroundGeolocation.DISTANCE_FILTER_PROVIDER, interval: 30000, fastestInterval: 30000, activitiesInterval: 30000, stopOnStillActivity: true, url: 'URL!', httpHeaders: {'X-FOO': 'bar', }, postTemplate: { lat: '@latitude', lon: '@longitude', } })Please suggest how can i proceed with the same requirement.Thanks for your time.
There is very little documentation on react native's PermissionAwareActivity and I need to implement its methods for Android API 23+ to allow the user to accept / decline bluetooth permissions.
import android.support.v4.app.ActivityCompat; import com.facebook.react.modules.core.PermissionAwareActivity;import com.facebook.react.modules.core.PermissionListener;public class MainActivity extends ExponentActivity implements PermissionAwareActivity { private PermissionListener mPermissionListener; @Override public int checkPermission(String permission, int pid, int uid) { return PackageManager.PERMISSION_GRANTED; } @Override public int checkSelfPermission(String permission) { return PackageManager.PERMISSION_GRANTED; } @Override public void requestPermissions(String[] permissions, int requestCode, PermissionListener listener) { mPermissionListener = listener; ActivityCompat.requestPermissions(this, permissions, requestCode); } @Override public void onRequestPermissionsResult(int requestCode, String[] permissions, int[] grantResults) { // callback to native module mPermissionListener.onRequestPermissionsResult(requestCode, permissions, grantResults); } ...I'm not really sure how I'm suppose to implement these methods. Any help is appreciated. Even if someone can point me to some documentation or resource which I cannot find.
I am pretty novice in react-native. I am trying to build a release APK of android for my react-native application. But I am getting this error :
AAPT: error: resource android:attr/fontVariationSettings AAPT: error: style attribute 'android:attr/keyboardNavigationCluster'AAPT: error: resource android:attr/fontWeight not foundAAPT: error: resource android:attr/fontStyle not found
I am using command gradlew assembleRelease
When I try to build debug APK, it builds successfully.I checked a few solutions but most of them were to upgrade android API versions to 28,29 and upgrading react version. However I am already using latest versions for both.Android API version : 28React Version : "react-native": "^0.61.5"
I have already tried clearing .gralde cache and rebuilding and Jetify before creating build.Please help if you have a different solution.
I'm developing my own video-conference Android-App and using the jitsi-sdk.But I want to set the back camera of my Smartphone as default. The user can change it once the conference is launched, but my goal is to change it before the conference begins without user interactions.
I already tried to switch camera by creating a cameraCapturer/videoCapturer, but the JitsiMeetActivity opens the front camera. Also I tried to use the putExtra-method for the launch-intent.
So my Activity extends from the JitsiMeetActivity and after Setting the JitsiMeetConferenceOptions the Conference is launched as followed:
Intent intent = new Intent(context, JitsiMeetActivity.class); intent.addFlags(Intent.FLAG_ACTIVITY_NEW_TASK); intent.setAction("org.jitsi.meet.CONFERENCE"); intent.putExtra("JitsiMeetConferenceOptions", options); startActivity(context, JitsiMeetActivity); After that, I can't change anything programmatically.
Is there any way to get the settings before the JitsiMeetActivity is opened?
I hope someone can help me.
I have seen many people recommending frameworks like Ionic, Xamarin, Flutter, React Native etc for developing Android apps. However, I have been coding in Android Studio using Java and Kotlin and have made a few apps.
So what is the difference between these frameworks and Android Studio? How are they better than Android Studio? I know Android Studio is an IDE but don't these frameworks also compile and run your code to create an Android app? So what's the difference?
I am trying to display an image from a URL. In the emulator, the image displays perfectly. When I run this on the device it displays a black block and after some moment the app crashes without any error.
If I remove borderRadius, borderColor, borderWidth property from Image style it works perfectly. But I need the circular shape.
I tried to native-base Thumbnail instead of Image but the problem persists. Then I tried to make a circular shape using View with overflow:hidden property but here the image edge not smooth. How can I solve this?
Black Block image in the device:
My code:
In Chrome I can go to Settings -> Downloads -> Ask where to save files -> On and during download I am presented with download dialog like on the picture below.
Is possible to achieve this behaviour with react-native-webview? If not, is it possible with android-webview?
I followed all the steps in React Native's get started page, including running npx react-native init AwesomeProject to create a starter project. (I'm following the steps for "React Native CLI Quickstart" / "macOS" / "Android"). Then I open up Android Studio, start the emulator, cd into the project's folder, and run npx react-native run-android. Everything works fine. I get to tweak the starter project here and there, reload, and everything works.
But I need to use React Navigation. I follow the steps here and apparently React Navigation is installed without any issues. Then when I run npx react-native run-android again the thing builds successfully and that Metro thing - that separate Terminal tab/window - says "done". But the emulator doesn't show my app. For a second it shows a blank page and then that disappears and I get the emulator's home screen. That's even if I don't tweak the starter code at all - I'm not even trying to import React Navigation, all I need to do to cause this error is to have it installed.
Here's what my Terminal tabs look like after npx react-native run-android:
I've tried closing Terminal and Android Studio after installing React Navigation. Same thing.
I'm using macOS 10.15.3 and Android Studio 3.5.3.
What am I doing wrong?
I am trying to run a react native app on my computer, using an a Ngrok server. I am using port 8081 on my computer, when i run the command npm start in terminal my server runs on the port, and when i cancel the process in terminal the page cant be reached. So everything seems to be in order there (its not another service running on that port).
When im trying to connect from my phone, using the Viro Media app, i get this error:
I have been going through too many google-pages on solutions, but i cant understand whats wrong. I also have been allowing connections to my computer in my security options, turned off the firewall, dubble checked that im in the correct folder etc.
Thanks in advance.
I build an android app in react native and expo. Now I made some changes to the code and was thinking that is it possible to update the app OTA for the users. My app is not published to the play store.I tried by expo build:apk but this build a new apk file and earlier one has no effect on it.
so this is my problem :my code just returning error 422 when send data from real devices, but doing good on emulator here is my form data code :
const data = new FormData();data.append('approval_store_code', this.state.selectedApotik.store_code);data.append('delivery_method_id', 1);data.append('recipe_document_images[]', { name: 'recipePhotos1', type: 'image/jpeg', uri: Platform.OS === 'android' ? this.state.imageResep[0].uri : this.state.imageResep[0].uri.replace('file://', ''),});and this is the code when i send to server
this.setState({spinner: true}); const response = await REQ.createRecipe(this.state.accessToken, data); console.log(response); if (response.status == 200) { console.log(response); this.setState({spinner: false}); this.props.navigation.navigate('SuccessFormPharmacy'); } else { alert('error'); this.setState({spinner: false}); } } catch (error) { this.setState({spinner: false}); console.log('error send data : ', error); alert('error send Data!'); return null; }the axios code :
return axios({ method: 'POST', url: `${API.BASE_URL}/v1/pharmacy/order`, headers: {'Content-Type': 'application/x-www-form-urlencoded', Authorization: `Bearer ${accessToken}`, }, body: formData, });the weird thing is, i have try using fetch instead of axios, didn't work for real device, but doing good on emulatori have try save the image first to devices, it saved but didn't success sent to server
on real device returning Error 422
I want to use a font from google fonts in my app. Here is the font.
I have placed the .ttf file in app/fonts.
package.json:
{"name": "xxx","version": "0.0.1","private": true,"scripts": {"start": "node node_modules/react-native/local-cli/cli.js start","test": "jest" },"rnpm": {"assets": ["./app/fonts"] },"jest": {"preset": "react-native","moduleNameMapper": {"\\.(jpg|jpeg|png|gif|eot|otf|webp|svg|ttf|woff|woff2|mp4|webm|wav|mp3|m4a|aac|oga)$": "<rootDir>/__mocks__/fileMock.js","\\.(css|less)$": "<rootDir>/__mocks__/styleMock.js" } },"dependencies": {"flow-typed": "^2.0.0","immutable": "^3.8.1","react": "~15.4.1","react-native": "0.42.0","react-native-vector-icons": "^4.0.0","react-redux": "^5.0.3","redux": "^3.6.0","redux-immutable": "^4.0.0","redux-observable": "^0.14.1","rxjs": "^5.2.0" },"devDependencies": {"babel-eslint": "^7.1.1","babel-jest": "19.0.0","babel-preset-react-native": "1.9.1","eslint": "^3.17.0","eslint-plugin-flowtype": "^2.30.3","eslint-plugin-jsx": "^0.0.2","eslint-plugin-react": "^6.10.0","eslint-plugin-react-native": "^2.3.1","flow-bin": "^0.42.0","jest": "19.0.2","jest-cli": "^19.0.2","react-test-renderer": "~15.4.1","redux-devtools": "^3.3.2","remote-redux-devtools": "^0.5.7" }}then ran react-native link.
Then use the font in my app:
import { View, Text } from 'react-native'import React from 'react'import Width from '../width/Width'import Shape from '../shape/Shape'import Height from '../height/Height'import Thickness from '../thickness/Thickness'export const Volcalc = () => (<View style={styles.container}><Text style={styles.text}>SHAPE</Text><Shape /><Text style={styles.text}>HEIGHT</Text><Height /><Text style={styles.text}>WIDTH</Text><Width /><Text style={styles.text}>THICKNESS</Text><Thickness /></View>)const $mainColor = '#00d1b2'const styles = { container: { flex: 1, padding: 20, backgroundColor: $mainColor }, text: { textAlign: 'center', color: 'rgba(255, 255, 255, 0.9)', fontSize: 15, fontFamily: 'Orbitron' }}In android it doesn't show the new font but has no error. In ios it has error:
Unrecognised font family "Orbitron"
What am I doing wrong?
How do I find out the EXACT value to place in fontFamily: 'xxx'?
I want to integrate webrtc in my react-native application ,Installed the package for react-native react-native-webrtc.Finished all the steps mentioned in the documentation ,But im getting error message
Could not get unknown property 'mergeResourcesProvider' for object of type com.android.build.gradle.internal.api.ApplicationVariantImpl. What will be the reason for the error.
I just set up a brand new react-native project (0.62). Running a fresh debug build works just fine.
I set up signing following the documentation: https://reactnative.dev/docs/signed-apk-android, and ensured that I'm using the following ABIs: "armeabi-v7a", "x86", "arm64-v8a", "x86_64".
To test out a release build, I run the following: npx react-native run-android --variant release
After running the above command, the app attempts to start and crashes immediately with the following stack trace:
--------- beginning of crash2020-05-01 09:34:26.707 19961-19976/? E/AndroidRuntime: FATAL EXCEPTION: create_react_context Process: <BUNDLE_ID>, PID: 19961 java.lang.UnsatisfiedLinkError: couldn't find DSO to load: libhermes.so at com.facebook.soloader.SoLoader.doLoadLibraryBySoName(SoLoader.java:789) at com.facebook.soloader.SoLoader.loadLibraryBySoName(SoLoader.java:639) at com.facebook.soloader.SoLoader.loadLibrary(SoLoader.java:577) at com.facebook.soloader.SoLoader.loadLibrary(SoLoader.java:525)Sure enough, when I unpackage the APK there is no libhermes.so in /lib/x86_64 (I am testing at the moment on pixel 2 API 28).
I'm not sure why hermes wasn't enabled to start out with, but just to be sure I set the following in my build.grade:
project.ext.react = [ enableHermes: true, // clean and rebuild if changing]Now after cleaning and building I do see libhermes.so. Unfortunately, I am still seeing the same exact issue. But I can see that the file exists.
At this point, I'm pretty stuck. I've followed a number of threads reporting the same issue (for example, this). It sounds like an underlying issue with soloader has been fixed and is being used with the latest version of react native. Although I'm using the latest version of RN, I'm still seeing this issue.
Not being terribly familiar with Android development, what steps might I take to investigate this issue further?
I'm trying to add a shadow on the bottom of a view, but i don't how to do it on Android. With elevation it put a shadow also on the top. Is there a way to do it like on iOS?
Here's my code:
export function makeElevation(elevation) {const iosShadowElevation = { shadowOpacity: 0.0015 * elevation + 0.18, shadowRadius: 0.5 * elevation, shadowOffset: { height: 0.6 * elevation, },};const androidShadowElevation = { elevation,};return Platform.OS === 'ios' ? iosShadowElevation : androidShadowElevation;}
left: iOS (expected)
right: Android
I am developing a react-native app with video call feature and need a 'heads up' notification hanging on for about 40seconds when user receives a call like we have for normal incoming calls. But it only lasts for about 3seconds. I have tried setting category to 'call' and priority to 'max' on Android 6.0 but to no avail.
An image displaying a notification for incoming call:
:ReactNative:Unexpected empty result of running '[node, undefined, config]' command.:ReactNative:Running '[node, undefined, config]' command failed.
FAILURE: Build failed with an exception.
Where:Script 'C:\Users\fonta\Desktop\apps\Agente-backup\node_modules@react-native-community\cli-platform-android\native_modules.gradle' line: 195
What went wrong:A problem occurred evaluating script.
internal/modules/cjs/loader.js:797 throw err; ^Error: Cannot find module 'C:\Users\fonta\Desktop\apps\Agente-backup\android\undefined' at Function.Module._resolveFilename (internal/modules/cjs/loader.js:794:15) at Function.Module._load (internal/modules/cjs/loader.js:687:27) at Function.Module.runMain (internal/modules/cjs/loader.js:1025:10) at internal/main/run_main_module.js:17:11 { code: 'MODULE_NOT_FOUND', requireStack: []}
Try:Run with --stacktrace option to get the stack trace. Run with --info or --debug option to get more log output. Run with --scan to get full insights.
Get more help at https://help.gradle.org
BUILD FAILED in 1s
error Failed to install the app. Make sure you have the Android development environment set up: https://facebook.github.io/react-native/docs/getting-started.html#android-development-environment. Run CLI with --verbose flag for more details.Error: Command failed: gradlew.bat app:installDebug -PreactNativeDevServerPort=8081:ReactNative:Unexpected empty result of running '[node, undefined, config]' command.:ReactNative:Running '[node, undefined, config]' command failed.
FAILURE: Build failed with an exception.
Where:Script 'C:\Users\fonta\Desktop\apps\Agente-backup\node_modules@react-native-community\cli-platform-android\native_modules.gradle' line: 195
What went wrong:A problem occurred evaluating script.
internal/modules/cjs/loader.js:797 throw err; ^Error: Cannot find module 'C:\Users\fonta\Desktop\apps\Agente-backup\android\undefined' at Function.Module._resolveFilename (internal/modules/cjs/loader.js:794:15) at Function.Module._load (internal/modules/cjs/loader.js:687:27) at Function.Module.runMain (internal/modules/cjs/loader.js:1025:10) at internal/main/run_main_module.js:17:11 { code: 'MODULE_NOT_FOUND', requireStack: []}
Try:Run with --stacktrace option to get the stack trace. Run with --info or --debug option to get more log output. Run with --scan to get full insights.
Get more help at https://help.gradle.org
BUILD FAILED in 1s
at checkExecSyncError (child_process.js:621:11)at execFileSync (child_process.js:639:15)at runOnAllDevices (C:\Users\fonta\Desktop\apps\agente-backup\node_modules\react-native\node_modules\@react-native-community\cli-platform-android\build\commands\runAndroid\runOnAllDevices.js:94:39)at buildAndRun (C:\Users\fonta\Desktop\apps\agente-backup\node_modules\react-native\node_modules\@react-native-community\cli-platform-android\build\commands\runAndroid\index.js:179:41)at C:\Users\fonta\Desktop\apps\agente-backup\node_modules\react-native\node_modules\@react-native-community\cli-platform-android\build\commands\runAndroid\index.js:133:12at processTicksAndRejections (internal/process/task_queues.js:93:5)at async Command.handleAction (C:\Users\fonta\Desktop\apps\agente-backup\node_modules\react-native\node_modules\@react-native-community\cli\build\index.js:164:9)the project compiled until recently, now it shows this error, I can't even run the command "./Gradlew clean" from the android folder. Can someone help me?