Quantcast
Channel: Active questions tagged react-native+ios - Stack Overflow
Viewing all 16565 articles
Browse latest View live

Push notifications not getting grouped (like Whatsapp)

$
0
0

I am using FCM Cloud Messaging framework to send and receive push messages for both Android and ios. To send messages from my server I call FCM v1 API. I use FCM SDK app in my native app (react native based) to generate device registration token, etc.I am trying to find ways where the push messages show grouped in device system tray like on Whatsapp i.e. messages containing a particular unique id should be grouped under one category e.g. all messages for a particular stock ticker showing under one group, etc.When searching for possible solutions I came across various links such as:

React Native - Android - FCM - Display group notification like What's app also allowing multiple grouped notifications

Group fcm notifications like whatsapp but allowing multiple group notifications

But none of those helped. For example sending "tag" field replaces previous message when new one is received with the same value. Moreover when app is closed none of the message handling functions of native app are executing on the device so I believe this should be purely a server side functionality. On FCM docs page there is no reference to grouping of messages.

https://firebase.google.com/docs/reference/fcm/rest/v1/projects.messages

Any suggestions on how to implement this ?


react-native-maps initialRegion, region and animateToRegion not working for iOS but working for Android

$
0
0

I have a React Native project using react-native-maps:

    getRegionForCoordinates(points) {        // points should be an array of { latitude: X, longitude: Y }        let minX, maxX, minY, maxY;        var arr = [];        Object.keys(points).map(key => {            var point = points[key];            arr.push([{latitude: point.latitude, longitude: point.longitude}])        })        points = arr;        var first = points[0];        minX = first[0].latitude;        maxX = first[0].latitude;        minY = first[0].longitude;        maxY = first[0].longitude;        // calculate rect        points.map((point) => {            minX = Math.min(minX, point[0].latitude);            maxX = Math.max(maxX, point[0].latitude);            minY = Math.min(minY, point[0].longitude);            maxY = Math.max(maxY, point[0].longitude);        });        const midX   = (minX + maxX) / 2;        const midY   = (minY + maxY) / 2;        const deltaX = (maxX - minX);        const deltaY = (maxY - minY);        return {            latitude       : midX,            longitude      : midY,            latitudeDelta  : deltaX,            longitudeDelta : deltaY        };    }   componentDidMount() {      var event     = this.props.event;      var mapData   = JSON.parse(event.map);      var map       = mapData[0];      var markers = [];      Object.keys(map.markers).map(key => {         var marker = map.markers[key];         var obj = [{ latitude: parseFloat(marker.lat), longitude: parseFloat(marker.lng) }];         markers.push(obj[0]);      });      var region = this.getRegionForCoordinates(markers);      setTimeout(() => {         this.ref.animateToRegion(region, 1);      }, 5000)   }    renderMap() {      var event     = this.props.event;      var mapData   = JSON.parse(event.map);      var map       = mapData[0];        return (<View><MapView                    provider={PROVIDER_GOOGLE}                    style={mapStyles.map}               ref={(map) => {                  this.ref = map               }}                    customMapStyle={customMapStyle}                      key={ `${Date.now()}` }>                    {                        map.markers.map(marker => {                            return (<EventMapMarker marker={marker} navigation={this.props.navigation} />                            )                        })                    }</MapView></View>        )    }

In this code I am trying to animate to a region based on the markers that will be displayed on the map. The latitude, longitude, latitudeDelta and longitudeDelta are correct as they work for Android.

However, on iOS it animates to a completely wrong region, both in the simulator and on the device.

Setting initialRegion or region doesn't seem to make any difference.

I have tried a bunch of different things, like animating in the onMapReady function, using a setTimeout to delay the animate, updating/downgrading react-native-maps, etc.. I don't know if this is a bug or something I have set incorrectly in my project.

React Native version is 0.59.0.

react-native-maps version is 0.27.1.

Do i need IOS developer account for React native ios developing

$
0
0

im going to port my app to IOS. i already built it on android but needs some package linking and some refactor for ios version. but im not going to deploy it on App Store. im going to upload my outputs(both android and ios) on a website to download.

in android you can easily create an apk and give it to anyone to test it for you.

i didn't have mac - iphone to test my app until now. having that in mind i have few questions:

1- do i have to have Apple Developer ID to be able to test my app even in debug mode?

2- if 1's answer is no, does creating IOS output require Apple Developer ID even if i dont want to push it to App Store

3- is it possible to install apps on IOS, downloading the output file(.ipa) from a website?

Open react native project in xcode

$
0
0

I'm sure I'm missing something simple. I have a React Native project working and I'm attempting to get it on the app stores. Following those instructions, after I have created my provisioning profile in the Apple Developer Dashboard, it says to double click the developer provisioning profile to launch xcode. It's these instructions exactly:

Now find the files you just downloaded on your computer, and double-click each of them in turn, causing Xcode to launch. Verify the profiles are there by opening a project or starting a new one for this test.

So I double-click my file, and xcode does launch but no windows open up. I do not have an xcode project for my react native app so I have nothing to open. There is no menus for 'build settings' or 'general' so I'm not sure how to proceed.

For reference, here is my react native directory structure:

my_project/    .expo/    assets/    node_modules/    src/    .bablerc    .gitignore    App.js    app.json    package-lock.json    package.json    README.md

Did I miss a step somewhere? How do I get an xcode project from this?

New React-Native Project: Build fails (ios)

$
0
0

I'm using:react-native-cli: 2.0.1react-native: 0.62.2Xcode: 11.3.1

Creating a react-native project (react-native init GetAway) and starting it withnpx react-native run-ios throws an build error:

The following build commands failed:    CompileSwiftSources normal x86_64 com.apple.xcode.tools.swift.compiler    CompileSwift normal x86_64 /Users/sercan/Desktop/Arbeit/Urlaub/rescue/GetAway/ios/Pods/YogaKit/YogaKit/Source/YGLayoutExtensions.swift(2 failures)

I have no clue, why it comes to an build error, to a new created project.If you have any ideas to solve this problem, please let me know.

Thanks in Advance

Edit: Link for full error message: https://docs.google.com/document/d/1o6tj9OrWmH-OZ5rCkYxhQTi-RYH36S5u36zpmBHHY3E/edit?usp=sharing

Updating to iOS sdk 13

$
0
0

I just got this message from https://developer.apple.com/news/?id=03262020b.

Deadline for App Updates Has Been ExtendedMarch 26, 2020We greatly value the worldwide developer community, and appreciate your commitment to making a difference in people’s lives through the power of technology. To accommodate developers who may need additional time to update their existing apps on the App Store, the deadline for adhering to the requirements below has been extended to June 30, 2020.Apps for iPhone or iPad must be built with the iOS 13 SDK or later and use an Xcode storyboard to provide the app’s launch screen.iPhone apps must support all iPhone screens and all iPad apps must support all iPad screens.Apps for Apple Watch must be built with the watchOS 6 SDK or later.Apps that authenticate or set up user accounts must support Sign in with Apple if required by guideline 4.8 of the App Store Review Guidelines.Apps in the Kids category must be in full compliance with guideline 1.3 and guideline 5.1.4. of the App Store Review Guidelines.Apps using HTML 5 must be in full compliance with guideline 4.7 sections 4, 5, and 6 of the App Store Review Guidelines.

I am currently using react-native 0.59 to generate my iOS and android code. What do I need to do to upgrade to iOS 13 sdk? I'm using Xcode 11.5 and targeting my builds to 10.x.

Error trying to install react native, not building correctly when running pod install

$
0
0

I am trying to learn react native, and I'm running into an issue when trying to to install dependencies. I have installed CocoaPods and followed all steps via the documentation. I am unsure why I am getting this error. When running pod install and pod install --repo-update I am getting the following output:

tyler@Tylers-MacBook-Pro ios % pod install --repo-update     Updating local specs repositoriesAnalyzing dependenciesFetching podspec for `DoubleConversion` from `../node_modules/react-native/third-party-podspecs/DoubleConversion.podspec`Fetching podspec for `Folly` from `../node_modules/react-native/third-party-podspecs/Folly.podspec`Fetching podspec for `glog` from `../node_modules/react-native/third-party-podspecs/glog.podspec`Downloading dependenciesInstalling DoubleConversion (1.1.6)Installing FBLazyVector (0.61.5)Installing FBReactNativeSpec (0.61.5)Installing Folly (2018.10.22.00)Installing RCTRequired (0.61.5)Installing RCTTypeSafety (0.61.5)Installing React (0.61.5)Installing React-Core (0.61.5)Installing React-CoreModules (0.61.5)Installing React-RCTActionSheet (0.61.5)Installing React-RCTAnimation (0.61.5)Installing React-RCTBlob (0.61.5)Installing React-RCTImage (0.61.5)Installing React-RCTLinking (0.61.5)Installing React-RCTNetwork (0.61.5)Installing React-RCTSettings (0.61.5)Installing React-RCTText (0.61.5)Installing React-RCTVibration (0.61.5)Installing React-cxxreact (0.61.5)Installing React-jsi (0.61.5)Installing React-jsiexecutor (0.61.5)Installing React-jsinspector (0.61.5)Installing ReactCommon (0.61.5)Installing Yoga (1.14.0)Installing boost-for-react-native (1.63.0)Installing glog (0.3.5)[!] /bin/bash -c set -e#!/bin/bash# Copyright (c) Facebook, Inc. and its affiliates.## This source code is licensed under the MIT license found in the# LICENSE file in the root directory of this source tree.set -ePLATFORM_NAME="${PLATFORM_NAME:-iphoneos}"CURRENT_ARCH="${CURRENT_ARCH}"if [ -z "$CURRENT_ARCH" ] || [ "$CURRENT_ARCH" == "undefined_arch" ]; then    # Xcode 10 beta sets CURRENT_ARCH to "undefined_arch", this leads to incorrect linker arg.    # it's better to rely on platform name as fallback because architecture differs between simulator and device    if [[ "$PLATFORM_NAME" == *"simulator"* ]]; then        CURRENT_ARCH="x86_64"    else        CURRENT_ARCH="armv7"    fifiexport CC="$(xcrun -find -sdk $PLATFORM_NAME cc) -arch $CURRENT_ARCH -isysroot $(xcrun -sdk $PLATFORM_NAME --show-sdk-path)"export CXX="$CC"# Remove automake symlink if it existsif [ -h "test-driver" ]; then    rm test-driverfi./configure --host arm-apple-darwin# Fix build for tvOScat << EOF >> src/config.h/* Add in so we have Apple Target Conditionals */#ifdef __APPLE__#include <TargetConditionals.h>#include <Availability.h>#endif/* Special configuration for AppleTVOS */#if TARGET_OS_TV#undef HAVE_SYSCALL_H#undef HAVE_SYS_SYSCALL_H#undef OS_MACOSX#endif/* Special configuration for ucontext */#undef HAVE_UCONTEXT_H#undef PC_FROM_UCONTEXT#if defined(__x86_64__)#define PC_FROM_UCONTEXT uc_mcontext->__ss.__rip#elif defined(__i386__)#define PC_FROM_UCONTEXT uc_mcontext->__ss.__eip#endifEOF# Prepare exported header includeEXPORTED_INCLUDE_DIR="exported/glog"mkdir -p exported/glogcp -f src/glog/log_severity.h "$EXPORTED_INCLUDE_DIR/"cp -f src/glog/logging.h "$EXPORTED_INCLUDE_DIR/"cp -f src/glog/raw_logging.h "$EXPORTED_INCLUDE_DIR/"cp -f src/glog/stl_logging.h "$EXPORTED_INCLUDE_DIR/"cp -f src/glog/vlog_is_on.h "$EXPORTED_INCLUDE_DIR/"checking for a BSD-compatible install... /usr/bin/install -cchecking whether build environment is sane... yeschecking for arm-apple-darwin-strip... nochecking for strip... stripchecking for a thread-safe mkdir -p... ./install-sh -c -dchecking for gawk... nochecking for mawk... nochecking for nawk... nochecking for awk... awkchecking whether make sets $(MAKE)... yeschecking whether make supports nested variables... yeschecking for arm-apple-darwin-gcc... /Library/Developer/CommandLineTools/usr/bin/cc -arch armv7 -isysroot checking whether the C compiler works... noxcrun: error: SDK "iphoneos" cannot be locatedxcrun: error: SDK "iphoneos" cannot be locatedxcrun: error: SDK "iphoneos" cannot be locatedxcrun: error: unable to lookup item 'Path' in SDK 'iphoneos'/Users/tyler/Library/Caches/CocoaPods/Pods/External/glog/2263bd123499e5b93b5efe24871be317-1f3da/missing: Unknown `--is-lightweight' optionTry `/Users/tyler/Library/Caches/CocoaPods/Pods/External/glog/2263bd123499e5b93b5efe24871be317-1f3da/missing --help' for more informationconfigure: WARNING: 'missing' script is too old or missingconfigure: error: in `/Users/tyler/Library/Caches/CocoaPods/Pods/External/glog/2263bd123499e5b93b5efe24871be317-1f3da':configure: error: C compiler cannot create executablesSee `config.log' for more details

I have tried googling this problem but have had no luck. Any help is greatly appreciated it!

Run react-native application on iOS device directly from command line?

$
0
0

Is it possible to run react-native application on an iOS device directly from the command line like we do on simulator with react-native run ios --simulator "iPhone 5s"?


React Native Swipeable (Swipe to delete) not closing

$
0
0

I'm using Swipeable from React-Native-Gesture-Handler to incorporate swipe to delete on my page.When I press delete, the contact gets deleted however the swipeable remains open.

I want it to close after it gets pressed but I can't seem to figure out how to do it.

This is my code:

const RightActions = (progress, dragX) => { return (<TouchableOpacity onPress={()=>{DeleteContact(i)}}><View style={[ContactsStyles.rightAction]}><Text style={ContactsStyles.actionText}>Delete</Text></View></TouchableOpacity>) }

Here is where I have Swipeable:

<Swipeable renderRightActions={RightActions} ><View style={ContactsStyles.UserContainer}><Text numberOfLines={1} style={[Fonts.Name]}> {obj.firstname} {obj.lastname} </Text>         {/* Message/Call Container */}<View style={ContactsStyles.ImageCont}>                    {/* Message */}<TouchableOpacity onPress={()  => Communications.text(obj.phone, 'Hey '+ obj.firstname +', im in need of a Ryde. Are you able to pick me up? This is my current location: '+ location)} ><View style={ContactsStyles.ImageBox}><Image style={ContactsStyles.Image} source={require('../../assets/icons/message.png')} /></View></TouchableOpacity>                    {/* Call */}<TouchableOpacity onPress = {() => Communications.phonecall( obj.phone , true)}><View style={ContactsStyles.ImageBox}><Image style={ContactsStyles.Image} source={require('../../assets/icons/phone.png')} /></View></TouchableOpacity></View>                  {/* End of Message/Call Container */}</View></Swipeable>

Swipeable button doesnt disappear after on press

Best Approach to Making Multi-paged Wizard form in React Native

$
0
0

As a beginner in React Native, I'm curious about the different approaches people use to make wizard forms on the app.

Problem: I'm trying to implement a multiple-step form where each question occupies a page with a NEXT and BACK button for navigation and a SUBMIT button at the end.

Progress: I've had some success with Formik and Yup. However, my approach currently is making 1 Formik forms for each sub-screen I have (e.g. Email has a formik form, Contact has a formik form), with a switch(step) in the container component to move to the screen respective to the step number.

Question:

1) Is there a way to make / handle wizard form cleanly, smoothly, and more scalably?

2) How can one reduce the # of formik forms used to only one master form for multi-step wizard form? One of the problems of placing the SUBMIT at the last child page is that it only submits the value inside that last formik form.

Feel free to make any comments. Thanks!

Could not connect to development server - React Native

$
0
0

I am creating an app using react native. I tried to change a file path to an image within my code and when I ran my app on the iOS emulator the following message was displayed.

error

I have tried a number of different methods such as closing the terminal and running the app again.

I also tried running localhost:8081 in my browser and was given the following message

erorro2

I have also tried deleting my node_modules folder and running yarn but this still hasn't fixed the problem.

Any ideas as to how I would fix this?

Linking.openURL(url) is not working on iOS (Trying to open Whatsapp)

$
0
0

For some reason, the linking feature to open a whatsapp contact is not working on iOS (it works perfect on Android), i followed the guide on this url for the setup https://reactnative.dev/docs/linking but always when i try to push the button that calls to whatsapp app to write a message directly, the app says something like:

Could not open this link, please review it and try again

The button in my screen app is this

openWhatsappUrl = () => {    const url = 'whatsapp://send?phone=+XXXXXXXXXXX';    Linking.canOpenURL(url).then((supported) => {      if (supported) {        Linking.openURL(url);      } else {        Alert.alert('Alert','WhatsApp is not installed',        );      }    });  };// This is on the render section from my screen<DefaultButton   title="¡Say Hi!"   containerStyles={styles.centeredButton}   onPress={() => this.openWhatsappUrl()}/>

The AppDelegate.m file has this configuration

#import <React/RCTLinkingManager.h>...- (BOOL)application:(UIApplication *)application   openURL:(NSURL *)url   options:(NSDictionary<UIApplicationOpenURLOptionsKey,id> *)options{  return [RCTLinkingManager application:application openURL:url options:options];}

The Info.plist file

<key>LSApplicationQueriesSchemes</key><array><string>whatsapp</string><string>fbapi</string><string>fb-messenger-share-api</string><string>fbauth2</string><string>fbshareextension</string></array>

React Native version

System:OS: macOS Mojave 10.14.6CPU: (4) x64 Intel(R) Core(TM) i5-5350U CPU @ 1.80GHzMemory: 24.91 MB / 8.00 GBShell: 5.3 - /bin/zshBinaries:Node: 10.16.0 - /usr/local/bin/nodeYarn: 1.22.0 - ~/.yarn/bin/yarnnpm: 6.9.0 - /usr/local/bin/npmWatchman: 4.9.0 - /usr/local/bin/watchmanSDKs:iOS SDK:Platforms: iOS 13.2, DriverKit 19.0, macOS 10.15, tvOS 13.2, watchOS 6.1Android SDK:API Levels: 23, 24, 25, 26, 27, 28, 29Build Tools: 23.0.1, 25.0.2, 26.0.1, 26.0.2, 26.0.3, 27.0.3, 28.0.0, 28.0.1, 28.0.2, 28.0.3, 29.0.2System Images: android-26 | Google APIs Intel x86 Atom, android-28 | Google APIs Intel x86 AtomIDEs:Android Studio: 3.0 AI-171.4408382Xcode: 11.3/11C29 - /usr/bin/xcodebuildnpmPackages:react: 16.8.6 => 16.8.6react-native: 0.60.5 => 0.60.5npmGlobalPackages:create-react-native-app: 2.0.2react-native-cli: 2.0.1

[fatal][tid:com.facebook.react.ExceptionsManagerQueue] ReferenceError: Can't find variable "props"

$
0
0

While the build is successful, I receive an error after the simulator launches. I also am receiving a message that the app crashes in preflight. Originally the error message had more to it but I suppressed part of the message and can't remember what I did to suppress it. :( I apologize for not adding any code, I just don't know if a code change is required for this issue.

I have tried commenting out a few import statements on the index.js page just to see if this problem is due to a library. So far, it's not making a difference.

Someone said it might be due to bad proptype somewhere. That sounds arduous to ferret out given all the libraries.

This error does NOT occur on Android, btw.

Here is my environment:

System:    OS: macOS 10.15.5    CPU: (8) x64 Intel(R) Core(TM) i7-3720QM CPU @ 2.60GHz    Memory: 2.93 GB / 16.00 GB    Shell: 3.2.57 - /bin/bash  Binaries:    Node: 12.16.2 - /usr/local/bin/node    Yarn: 1.22.4 - /usr/local/bin/yarn    npm: 6.14.4 - /usr/local/bin/npm    Watchman: Not Found  Managers:    CocoaPods: 1.9.1 - /usr/local/bin/pod  SDKs:    iOS SDK:      Platforms: iOS 13.5, DriverKit 19.0, macOS 10.15, tvOS 13.4, watchOS 6.2    Android SDK: Not Found  IDEs:    Android Studio: 3.6 AI-192.7142.36.36.6392135    Xcode: 11.5/11E608c - /usr/bin/xcodebuild  Languages:    Java: 14.0.1 - /usr/bin/javac    Python: 2.7.16 - /usr/bin/python  npmPackages:    @react-native-community/cli: Not Found    react: 16.11.0 => 16.11.0     react-native: 0.62.2 => 0.62.2   npmGlobalPackages:    *react-native*: Not Found

xcode console:

enter image description here

enter image description here

    A firebase.json file was not found, whilst this file is optional it is recommended to include it to configure firebase services in React Native Firebase.▸ Generating 'UberMeets.app.dSYM'    The iOS Simulator deployment target 'IPHONEOS_DEPLOYMENT_TARGET' is set to 7.0, but the range of supported deployment target versions is 8.0 to 13.5.99. (in target 'react-native-splash-screen' from project 'Pods')    The iOS Simulator deployment target 'IPHONEOS_DEPLOYMENT_TARGET' is set to 7.0, but the range of supported deployment target versions is 8.0 to 13.5.99. (in target 'RNSound' from project 'Pods')    The iOS Simulator deployment target 'IPHONEOS_DEPLOYMENT_TARGET' is set to 5.0, but the range of supported deployment target versions is 8.0 to 13.5.99. (in target 'CocoaAsyncSocket' from project 'Pods')    The iOS Simulator deployment target 'IPHONEOS_DEPLOYMENT_TARGET' is set to 7.0, but the range of supported deployment target versions is 8.0 to 13.5.99. (in target 'abseil' from project 'Pods')    no rule to process file '/Users/user923545/Desktop/ubermeets5/ubermeets/ios/Pods/Flipper-RSocket/rsocket/README.md' of type 'net.daringfireball.markdown' for architecture 'x86_64' (in target 'Flipper-RSocket' from project 'Pods')    no rule to process file '/Users/user923545/Desktop/ubermeets5/ubermeets/ios/Pods/Flipper-RSocket/rsocket/benchmarks/CMakeLists.txt' of type 'text' for architecture 'x86_64' (in target 'Flipper-RSocket' from project 'Pods')

Is there a workaround for keeping the flash on when recording starts? (iOS + Expo/Expo-camera)

$
0
0

My app needs the flash to stay on when recording a video. I'm using expo to develop and test for react-native on both Android and iOS. Android works as expected, but on iOS, setting the flashMode to 'torch' still turns off the flash when recordAsync is called. I've tried using other modules for the torch/flash function, but none work at the same time as the camera.

React Native build failed - iOS - library not found for -lBoringSSL-GRPC

$
0
0

I'm having issues trying to build a react native application. On Android works fine. This happens building from xcproject and xcworkspace

I already try with pod deintegrate and pod install

The terminal says:

clang: error: linker command failed with exit code 1 (use -v to see invocation)

React native: TypeError: null is not an object (evaluating 'SplashScreen.preventAutoHide')

$
0
0

My react native app was working just fine before I used expo eject. I ejected it because I now intend to build and release the app to the ios app store. As soon as I attempt to start the ejected app using react-native run-ios after it's been ejected I get the exception below.

Please could someone help to understand what's causing this issue and how to tackle it?

react Native versions as follows:

react-native-cli: 2.0.1react-native: 0.61.5

enter image description here

TypeError: null is not an object (evaluating 'SplashScreen.preventAutoHide')This error is located at:    in AppLoading (at AppLoading.js:52)    in AppLoading (at App.js:464)    in App (at renderApplication.js:40)    in RCTView (at AppContainer.js:101)    in RCTView (at AppContainer.js:119)    in AppContainer (at renderApplication.js:39)preventAutoHide    SplashScreen.js:4:21AppLoading#constructor    AppLoadingNativeWrapper.js:6:8renderRoot    [native code]:0runRootCallback    [native code]:0renderApplication    renderApplication.js:52:52runnables.appKey.run    AppRegistry.js:116:10runApplication    AppRegistry.js:197:26callFunctionReturnFlushedQueue    [native code]:0

react-native-sound does not work in production build for iOS but works within emulator and for production android

$
0
0

I'm working on a React Native application which plays back voicemails. I'm running into an issue with our production app. It does not play back the voicemails on the production iOS or testflight builds, however it will play back on the production build of android as well as the emulator for iOS and Android. I'm relatively new to react-native applications so I'm trying to figure out why this would be occurring.

The app does not crash, it shows the playback as occurring in the UI but no audio is played.

What are specific things to check regarding a production build not being able to play sound?

I am on the current version of react-native-sound which is currently 0.10.9.

Here is my togglePlay function which uses Sound from react-native-sound. I have imported it.

togglePlay() {

  if (this.state.vmLoaded == false) {        if (this.state.vmLoading == true) {            return;        }        if (this.state.vmLoading == false) {            this.setState({ vmLoading: true });            Requester.getVoicemail(this.props.vmData, this.props.token, 'stream')            .then((res) => {                this.setState({                    vmPath: res,                    vmLoaded: true,                });                const vm = new Sound(res, '', (error) => {                    if (error) {                        // Show toast if voicemail did not load                        Toast({ message: 'Failed to load voicemail' });                    } else {                        if (!this.state.vmStarted) {                            this.setState({ vmStarted: true });                        }                        vm.play((success) => {                            if (success) {                                this.setState({                                    vmPlaying: false,                                    currentTime: this.state.vmLength / 1000,                                });                                // Clears the interval timer to keep thread                                // from keeping track of timing                                timer.clearInterval(this, 'playingInt');                            } else {                                // if call recording fails to play, show toast to user                                Toast({ message: 'Failed to play recording' });                            }                        });                        this.setState({ vmPlaying: true });                        // if loaded successfully, set the instance of Sound as STATE vm                        // allowing calls to the instance via this.state.vm                        // ie: this.state.vm.play() will initiate playing the sound                        this.setState({                            // set instance of Sound to state                            vm,                            // set full length of recording to state                            vmLength: vm.getDuration(),                            // set current playing time of recording to state (new, so zero)                            currentTime: 0,                            // interval is still null until sound is played                            interval: null,                            // sound starts off paused (no audio)                            vmPlaying: true,                            // Finally, the recording has been loaded, setting                            // this so another instance is not created on                            // rerender (see above IF statements)                            vmLoaded: true,                            vmLoading: false,                        });                    }                });            }).then(() => {                timer.clearInterval(this, 'playingInt');                interval: timer.setInterval(this, 'playingInt', () => {                    this.state.vm.getCurrentTime((seconds) => {                        this.setState({ currentTime: seconds });                    });                }, 1000);            });        }    } else if (this.state.vmLoaded == true) {        if (this.state.vmPlaying == true) {            this.state.vm.pause();            this.setState({ vmPlaying: false });            timer.clearInterval(this, 'playingInt');        } else {            this.state.vm.play();            this.setState({ vmPlaying: true });            timer.clearInterval(this, 'playingInt');            interval: timer.setInterval(this, 'playingInt', () => {                this.state.vm.getCurrentTime((seconds) => {                    this.setState({ currentTime: seconds });                });            }, 1000);        }    }}

Please let me know if other information would be helpful in debugging this.

Thank you

Why aren't any of my "react-native" commands not working anymore?

$
0
0

I was working in my React Native file when I noticed that whenever I typed any command(except help) that begun with "react-native" I would receive an error that states:

error Unrecognized command "link".

info Run "react-native --help" to see a list of all available commands.

I got this error when I tried both "react-native run-android" and "react-native link". I have no idea what's causing this so I would really appreciate any suggestions as to what to try to remedy this. I also have't linked any of my actual code as I have no idea what part of my project could be the cause of this. I'd love to hear any suggestions that anyone has for me.

how to use LinearGradient for react tab navigator tabs

$
0
0

I have a react tabnavigator which i used it from ReactNavigation(v2) component:

const Tab = createMaterialTopTabNavigator({  Nearest: {    screen: Nearest, navigationOptions: {      tabBarLabel: 'myprofile'    }  },  Recomanded: {    screen: Recomanded, navigationOptions: {      tabBarLabel: 'recomanded'    }  },  Home: {    screen: Hotest, navigationOptions: {      tabBarLabel: 'hotest'    }  },},  {    tabBarOptions: {      labelStyle: {        fontSize: 12,         fontFamily:"IRANSans"      },      tabStyle: {        backgroundColor: '#ef6102',      }    }  });

now i want to use linear gradient for Tabs color but i couldn't find any way to do it!...how its possible ? how can i take the tabs inside this tag:

<LinearGradient  colors={['#EF7D2F', '#C8191A']}>..here..</LinearGradient>

React Native - ios - circle with border - circle background color spilling out of circle

$
0
0

I'm trying to create a circle with a white background in react native and i'm having an issue where the background color of the circle is seen on the outline of the border.

Check out this playground app:https://rnplay.org/apps/TsQ-CA

If you look closely you can see that around the circle there's a thin black line. It's like the border isn't covering the entire background.

Here's the circle style:circle: { borderRadius: 40, width: 80, height: 80, borderWidth: 5, borderColor: 'white', backgroundColor: 'black' }

P.S. this only happens on iOS

Any ideas??Thanks!

Viewing all 16565 articles
Browse latest View live


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