I'm making an app in React Native and I wanted to make a keyboard accessory view which would basically extend the keyboard on the device, so it would have to have the exact same colour as the keyboard.
I'm using KeyboardAccessoryView for Android and InputAccessoryView for iOS to do this.
My question is - is there any way to retrieve the colour of the keyboard the device is using in code for both iOS and Android?
I thought maybe the PlatformColor function in React Native would have this, but I find nothing mentioning keyboards there.
Related
We are working on a webpage that is currently having issues with split screen resizing.
When we change the orientation of the page on a mobile browser or do a window resize on a desktop browser, we are able to run the required updates fine because we listen to the resize and orientationchange events that get fired with either type of event.
However, we just realized that with split screen on Android (and possibly split screen on iOS tablets), we aren't triggering any resize events for the window and therefore can't do proper updating of our elements based on the split screen being activated or updated (when the user moves the split).
Is this something we can work around or am I just completely missing some functionality that I should be using?
I have looked around online and haven't found anything related so far that I could use from our JS.
Thanks! Any pointers would be greatly appreciated.
Information about Multi-Window Feature in Android - doesn't go over any possible ways to detect it from a web view though, but looks at it from an Android app dev perspective
I am trying to develop an app with the Apache Cordova tools for Visual Studio and i believed i had finished the project until I started using it on a device and the on-screen keyboard re-sized the entire app when it popped up. The application looks the way i would like it to until the user selects an input box and the on-screen keyboard pops up, which then makes the screen shrink to compensate for the keyboard.
How can I make it so that the keyboard just overlaps the layout already present instead of re-sizing it and making a new one? I can't seem to find any solutions on the internet so any help would be greatly appreciated.
Thanks
Dustin - you need to use the Keyboard plug-in to help customize this behavior. You can find the plug-in at NPM: https://www.npmjs.com/package/cordova-plugin-keyboard
The exact line of code that will give you what you want is:
Keyboard.shrinkView(false);
Cheers,
Kirupa
I design html page with an interface using css for android devices. It looks great:
The problem is that when I click on an area that opens the keyboard the resolution changes, breaking the all design.
In ios devices the keyboad floats over the browser and this issue dosen't happens.
Is there some way to avoid this or some fix to apply?
I'm currently adding a popup (Add To Home Screen Feature) to an existing mobile web app using jQuery mobile. I would like to place the exact same icon the user has on their phone (based on Android version) inside the popup instructions rather than show 6 different icons the user may have.
Is there any specific jquery/javascript doing this or can anyone provide or direct me to an icon set (specifically just the menu icon) with android version numbers that I can pull from to create some logic to determine exactly the menu icon they need (based on version) to press to bookmark the site? I can't find this anywhere.
Edit:
Looking specifically for hardware specific menu icons for Android devices. They use many different kinds and would like to know if I can detect the device hardware being used and use the appropriate icon? Is this even possible?
You can figure out the android version using this code from another answer.
There used to be no standard for android menu buttons. Hardware manufacturers tended to make the menu icon whatever they wanted. I would heavily suggest using the modern, unified icon with three dots like this one from the android developers site.
Is there a more native solution using Phonegap to create the iOS7 blur effect other than using CSS or javascript?
I have never used Phonegap before, my app needs the blur effect and I'm trying to decide to either use my web skills to create this app or hire a native developer.
Thanks guys!
The answer is, as usual, it depends.
CSS3 does support blur, but not in the same way iOS 7 uses. This means it is possible to create a static blur (say, on the navigation bar), but there is no great way discovered (last I knew) to enable a dynamic blur -- which is probably what you want, if trying to mimic iOS 7.
Although it flies a bit in the face of the question to pose this as a solution, one option is to simply not implement a blur. You can approximate something similar by using a gradient (say, 75% opaque to 100% opaque). Depending on your needs, this may be sufficient. (I first noticed this at this site: https://mir.aculo.us/2013/09/16/how-to-create-a-web-app-that-looks-like-a-ios7-native-app-part-1/)
The other option is to use a native navigation bar. It introduces its own set of problems (for example: how best to synchronize your non-native view transitions with native navigation bar's transitions), but it means you also get iOS 7's blurring on the navigation bar for free. I've got a (very alpha) plugin that implements this (as well as toolbars) here: http://plugins.cordova.io/#/package/com.photokandy.nativecontrols