I just started testing my Ionic 5 app in IOS 15.0.2 and when I long press on any image it's allowing me to drag the image to other apps and photos and directly save it. When I drag the image to any text editor app, it shows the base64 string of the image.
The same is not happing in IOS 14 and I need to stop this behavior of the app. How can I control this from my ionic app?
The following CSS resolved the issue.
img {
pointer-events: none;
}
Now there are no event fired on long press images.
just try:
-webkit-user-drag: none;
or you can reference：https://www.denisbouquet.com/css-forbid-selection-user-select-dragging-ghost-image/
Related
In my RN (ios based) app my images used to show perfectly, but for whatever reason stopped appearing. I keep them in an img folder labeled as 'home.png' etc.
I imported Image from react-native
import { SafeAreaView, StyleSheet, ScrollView, View, Image, Text, StatusBar, } from 'react-native';
and attempt to display it in return section with:
<Image source={require('./img/cool.jpg')}/>
The image will not show regardless of png or jpg extension. It shows up gray.
I created a fresh RN app and repeated the above, importing Image & using:
<Image source={require('./img/cool.jpg')}/>
In the fresh app, the image shows no problem. What could possibly be doing this? I can't get the images to show on any of my screens for the app I'm working on.
Surprisingly, images BREAK after certain updates whether it be React native or iOS updates. An absolutely unbelievable headache that no one seems to have encountered before. Luckily, copying code logic to a new working app fixed it. I hope this NEVER occurs again.
I am currently trying to display a static image within my react native app. I am using the Image Component from React Native, so there is nothing custom.
Maybe important to mention is that i am opening the Main App with my Share Extension => Image Gallery, Select Image, Share with Main App.
On the Simulator it works just great, when i am using a real device nothing is displayed. Here is the Image path i am trying to display:
<Image
style={styles.image}
source={{
uri: "/private/var/mobile/Containers/Data/PluginKitPlugin/156268E6-6BE0-4055-BF0E-0EDC546FC2F9/tmp/RNSE_TEMP_IMG.png",
isStatic: true
}}
/>
I have tried adding file:// + /private.... but this did not help at all.
Any ideas?
I've created an app for Android and iOS using Phonegap and Ionic Framework, the goes perfectly on Android but it has an issue on iOS specially with the iPhone 5 and the iPad (It works well on iPhone 6 and 4).
When you tap a button that makes the rol of a backbutton, the back animation is shown but inmediatly the goes back to the section where the backbutton was taped. It only happens on one section, the backbutton works perfectly on the others sections.
The HTML element is the following:
<a class="button button-icon button-positive button-positive icon ion-arrow-left-c" ng-click="atras()">
The function called is "atras" which is the following (Located in the controller of the template):
$scope.atras = function() {
$ionicHistory.goBack();
};
Have any idea of how could i resolve this? Thanks a lot for your answers!
Specifically, there is a notable patch for Ionic UIWebView that are built on iOS9. Without this patch, you will experience such flickering issue when you tap on some back buttons in navigation bar. Please apply ngIOS9UIWebViewPatch for your project then it's all done.
https://gist.github.com/IgorMinar/863acd413e3925bf282c
http://blog.ionic.io/ios-9-potential-breaking-change/
Unfortunately iOS 9 has some bugs with with window.location that impact the router-ui and also some empty href links <a href="#"> like yours.
Take a look to these articles from Ionic's blog:
Preparing for iOS 9
iOS 9 Potential Breaking Change
There you can find the link to the iOS9 patch for angular and this for Disable App Transport Security in iOS 9
Add these two properties to prevent flickering effects:
-webkit-transform-style: preserve-3d;
-webkit-backface-visibility: hidden;
Apply also to flickering elements which AREN'T being animated for the same fix.
I've been working on a new responsive website, and when I start testing in on IPad, I found that it was crashing consistently (tested on IOS 6, IOS 7 and IOS 7.1.1).
After a few hours, I found that what was causing the crash was this CSS instruction:
-webkit-backface-visibility: hidden;
I was able to create a sample on jsfiddle that replicates this issue:
http://jsfiddle.net/CBqCH/6/
In our case, we were using that style on a listing page, that has for ex: 500 items..
Is this a known issue? Or am I 'styling' it wrong?
Looking at your css/fiddle its like your adding this like this:
*{ -webkit-backface-visibility: hidden; }
Or in other words you are adding it on all the divs...
NEVER target all elements (of course it will crash if you're calling multiple), only the ones you need to.
But if not this it seems, that it is common using these css on iOS:
Mobile Safari on iOS crashes on big pages
http://www.dimshik.com/ios-7-runs-out-of-memory-when-using-webkit-transform/
I am implementing a webapp using jQuery Mobile and Phonegap. One thing I am missing, is the following: The App should scroll to the top when the statusbar is tapped.
I have already seen that using Objective C one has to indicate the view that has to scroll to top on tap. Is it possible to do something similar with Javascript/Phonegap?
Update for 22.9.2016
It's working fine
Plugin ID has changed, install it using:
cordova plugin add cordova-plugin-statusbar
Tested with cordova-6.3.1 cordova-ios-4.2.2 in the iOS 10.0 simulator and an iPhone 6s Plus running 9.3.5.
The official status-bar plugin has this feature.
https://github.com/apache/cordova-plugin-statusbar
Install:
cordova plugin add org.apache.cordova.statusbar
In your javascript:
window.addEventListener('statusTap', function() {
//scroll-up or do whatever you want
});
I wrote a plugin to solve this issue
https://github.com/j-mcnally/cordova-statusTap
you can register tap events on the status bar and handle this all in code. With an event listener.
if the content that you are displaying in the phonegap app is bigger then the bounds of the webview, the scroll happens automatically.
Otherwise - for example if you are just scrolling a div using -webkit-overflow-scrolling - you need to use the solution found here:
How to detect touches in status bar
In the scrollViewShouldScrollToTop you need to call
[theWebView stringByEvaluatingJavaScriptFromString:"should_scroll_to_top"];
should_scroll_to_top is a normal function in your js.