I'm new at creating React Native apps and I would like to know if there is a doc or a package that allow us to open my app from an external one by clicking on the "share" button, that open the "open in... / share" dialogue modal
Thanks by advance
EDIT :
I have read the instructions given in the following link : React Native Share Extension
but the thing is that it asks to edit some Java files for Android, and other ones for iOS. Since I'm working with javascript files, where am I supposed to find the files the documentation tells me to edit ?
There is nothing built-it to do this, but there's also some useful packages for doing that, the catch is that you will need to write some native code to make it work
first there is React-native-share-extension forn handle share intents, and for more advanced stuff there is react-native-deep-link for handling for example an url of a video, or a download url, or a mail intent .
Both packages requires to edit native ;-;
Related
i'm building a web app with capacitor js and react js.
i'm creating a button to when i click the button to upload image file.
in android it works well, but in ios when i click the button it prints three options like above picture.
i want to make those options to korean.
i knew the language of the messages are depends on system language.
so i already checked the system language setting by window.navigator.language
it already setted in korean.
and then i dont know reason why, it prints in korean when i open a app in native safari browser.
this problem only occurs when i open the web in the app i built by capacitor
someone please give me some hints .
You can set the development region in your ios/App/App/Info.plist file:
<key>CFBundleDevelopmentRegion</key>
<string>ko</string>
Hello Guys !
Today I deployed an app online to test it but didn't understood very well why it didn't work.
What I did :
I've created a sample react app using bootstrap and used firebase to deploy it. Here is the link.
What was expected ?
I wanted the app to be able to be downloaded on the phone as angular.io is.
Reality :
Nothing special. It's in fact registered in service worker and very fast to load and download, but nothing more.
Problem now :
I've done it today two times but wasn't able to use it as well as the image of service workers I had.
What should I do ?
You need a a 144px square PNG icon to be defined in your manifest.json to enable the web app install banner.
You can validate whether your application can be added to your homescreen from Chrome on a desktop computer.
To do so, open the Chrome developer tools on your website, open the 'Application' tab, click 'Manifest' in the left navigation and then click 'Add to homescreen'.
If there's a problem adding to homescreen an error will appear in the console, when trying it on the website you mentioned I received the error 'Site cannot be installed: a 144px square PNG icon is required, but no supplied icon meets this requirement'.
You can read more about the requirements for web app install banners here https://developers.google.com/web/fundamentals/app-install-banners/.
I am making a Chrome Extension that overlays a choice div over the current web page.
I have spent considerable time studying how to develop a Chrome Extension with React and with regular ways to inject HTML and JS. More React-specific information is needed to put this together.
My goal is to achieve this:
Click default_popup which reveals some extension settings
Toggle overlay ON
A full-screen overlay covers the current webpage
Dismiss the default_popup modal
The overlay is still there because the React-based extension is still running
Click default_popup which reveals the extension settings again
Toggle overlay OFF
I have followed every tutorial I can find on Google and dissected every React Chrome Extension I can find in GitHub, and this my question that arises after that.
Can anyone provide an example or describe exactly what needs to be done to achieve the above steps?
The most important thing I can't find from any tutorials or code spelunking is how do I inject a React App as a Chrome Extension and have it talk to the default_popup modal?
To communicate between the popup ( i assume you mean browserAction here) and any open tab the easiest way would be through background script.
So in manifest.json you add
"background": {
"scripts": ["background.js"]
}
and then in background.js file you can listen to events emitted from contentScript or browserAction scripts with onMessage
//background.js
chrome.runtime.onMessage.addListener( function(message){
// do some actions depending on message object
// e.g. add or remove overlay with tabs api
}
and send message from your popup with sendMessage like this
chrome.runtime.sendMessage({ action: "TOGGLE_OVERLAY", toVisible: true})
please note: if you want to send messages to content scripts you should use tabs API sendMessage instead
Its been about a month since I started using AngularJS. I used to write my codes in SublimeText2 but i wanted to use WebStorm since it claimed to be more AngularJS friendly. I wrote a simple Hello World app and tried to run it but i couldn't get any hint of how to do it. I also don't have any knowledge about Node.js.Do i need Node.js to run app on WebStorm? Is Node.js a server? I tried going through tutorials on WebStorm page and also read few articles on Node.js but couldn't understand it. Can anyone explain it in a simple and understandable way?
You can open your HTML+JS application in the selected browser in WebStorm by clicking on the browser icon on the top right corner of the editor tab with index.html file opened (or any other html file you'd like to open in browser).
The same action could be done from the file context menu: Open in - Browser.
WebStorm will automatically start built-in web server for your convenience.
Note that you still can go to your project folder and execute your particular HTML file from there, the same way you would do it with the text editor.
Read more on working with AngularJS in WebStorm in this blog post.
If you have back-end in Node.js for your app, then you, of course, need Node.js installed. To run your node web app you need to create Node.js run configuration. More on it here.
I need my own splash screen when starting up my app.
I use SenCha Touch + Cordova.
Searched and found several ways to do splash screens, however I do not think they are up-to-date.
I saw some code which tried to add a few lines of code into launch function, but the latest Sencha Touch does not do it in the app.js any more instead, it add the Main view to its viewport.
Also, I checked Sencha Touch doc and found
Class currently only works with Cordova and does not have a simulated
HTML counter part. Please see notes on Cordova Docs for proper Native
project code changes that will need to be made to use this plugin.
But it provides some methods after that statement :
newExt.device.Splashscreen( ) : Ext.device.Splashscreen
So I feel confused and don't know which one should I follow.
What is the latest approach to do the splash screen in Sencha Touch?
I currently have the exact same problem as you. Here is information I got from Sencha:
All splashscreen functionality is provided by the Cordova/Phonegap plugin. Our class methods are just convenience methods to the cordova native API and will provide a 'stub' for you if Cordova is not available so that your application does not bomb upon startup (no splashscreen shows, it's just that your app will not crash when trying to access an API that is not there).
In theory, if your application is built with Cordova/Phonegap and your splashscreen images are provided with the application build as specified by Cordova/Phonegap you would initiate a call to Ext.device.Splashscreen.show() after the device is ready (as demonstrated in the example found in http://docs.phonegap.com/en/2.6.0/cordova_splashscreen_splashscreen.md.html#Splashscreen)
The splashscreen feature is a native API, not one that is provided by Touch. You can, should you wish, provide your own coding in your index.html file of your native application which will manually display an image (much the same way we do the initial CSS flashing load indicator), but ultimately that would be up to you to implement manually.
I would suggest that you follow the Cordova guidelines, place your images in the res/drawable directory of your android project and let Cordova do all the hard work for you by just making a single call to Ext.device.Splashscreen.show() when the device is ready and then calling Ext.device.Splashscreen.hide() in the launch area of your application to hide it when your app has rendered its view.
To include Cordova in your application, we now provide you with sencha cmd switches to enable Cordova. You can find more information here
http://docs.sencha.com/touch/2.3.1/#!/guide/cordova
Please note that you will have to download all required components of Cordova, modify the Cordova configuration files as outlined in the Cordova docs, and build the application using either the Cordova command line interface (CLI) or your favourite Android build IDE (Eclipse, IntelliJ, etc).
Use this plugin https://build.phonegap.com/plugins/620
When you use this plugin and build locallym you have to place the icons and splashscreen in the res/ folder manually.