Double tap zoom

4.3.0 • Public • Published 3 months ago ReadmeCode Beta0 Dependencies2 Dependents15 VersionsREACT NATIVE IMAGE ZOOMA performant and customizable image zoom componentbuilt with Reanimated v2+ and TypeScript. 🌃 🚀Demo:What's newEnhanced Pan Gesture Handling: Improved the accuracy and responsiveness of pan gestures, ensuring smoother and more natural interactions when panning images.Refined Single Tap Detection: The single tap gesture functionality has been enhanced to trigger more reliably, providing better consistency and control without interfering with other gestures.Updated Example Integration:Added new examples demonstrating how to leverage the scale value for custom animation effects.Provided an example showcasing how to integrate the Image Zoom Component with react-native-reanimated-carousel, allowing for animated, zoomable image carousels.TypeScript Support for Animated Props: Expanded TypeScript definitions to include support for animated props, ensuring better type safety and compatibility with Reanimated-based animations.FeaturesSmooth Zooming Gestures: Ensure smooth and responsive zooming functionality, allowing users to easily zoom in and out of images using intuitive pinch and pan gestures.Reset Zoom and Snap Back: The component automatically resets zoom and snaps back to the initial position when the gesture ends.Double Tap to Zoom: Enable a double tap gesture for users to seamlessly zoom in and out of images. When double tap functionality is enabled, the automatic Reset Zoom and Snap Back feature will be disabled, allowing users to maintain their desired zoom level without automatic resets.Single Tap Functionality: Detect and process single tap gestures to trigger specific actions or functionality as needed within the componentCustomizable Zoom Settings: Utilize minScale, maxScale, and doubleTapScale props for precise control over minimum, maximum, and double tap zoom levels, tailoring the zoom behavior to application requirementsCustomizable Functionality: Enable or disable features such as panning (isPanEnabled), pinching (isPinchEnabled), single tap handling (isSingleTapEnabled), and double tap zoom (isDoubleTapEnabled) based on specific application needs.Access Scale Animated Value: Provide a Reanimated shared value for the scale property, allowing you to access and utilize the current zoom scale in your own code.Interactive Callbacks: The component provides interactive callbacks such as onInteractionStart, onInteractionEnd, onPinchStart, onPinchEnd, onPanStart, onPanEnd, onSingleTap, onDoubleTap and onResetAnimationEnd that allow you to handle image interactions.Access Last Values on Reset: The onResetAnimationEnd callback returns the last zoom and position values when the component resets (zooms out), providing more control and feedback for custom logic.Ref Handle: Customize the functionality further by utilizing the exposed reset and zoom methods. The 'reset' method allows you to programmatically reset the image zoom as a side effect to another user

Android’s vanilla double-tap to zoom feature.īut that’s just one of the things that makes xScope worth checking out. It may sound like a complicated maneuver, but if you’re holding a phone in one hand, or if you have a device that doesn’t support multitouch, it’s actually really easy to use. Double tap, hold, and drag your finger left and right to zoom in and out. I've tried every android browser out there and safari on the ipad, and none are as fast, feature packed or polished as Xscope 6 click here to try it. The xScope web browser offers a third way. There are generally two ways to zoom in and out of web pages and images on Google Android devices: You can use two fingers to pinch and zoom or double tap with a single finger to zoom. Recently xScope Browser Got Faster,Much Faster As matter of fact it is now the fastest Browser available on Android.

PageThree-finger swipe downScroll down one pageThree-finger swipe upScroll left one pageThree-finger swipe rightScroll right one pageThree-finger swipe leftTake action on an itemUse VoiceOver gestures to perform actions on an item.ActionGestureSelect an itemTapActivate the selected itemDouble tapDouble-tap the selected itemTriple tapDrag a sliderTap the slider to select it, then swipe up or down with one finger; or double-tap and hold the slider until you hear three rising tones, then drag the sliderStart or stop the current action (for example, play or pause music or a video, take a photo in Camera, start or stop a recording, start or stop the stopwatch)Two-finger double tapDismiss an alert or return to the previous screenTwo-finger scrub (move two fingers back and forth three times quickly, making a “z”)Edit an item’s label to make it easier to findTwo-finger double tap and holdTip: As an alternative to selecting an item and double-tapping to activate it, touch and hold an item with one finger, then tap the screen with another.Use gestures to control VoiceOverUse these gestures to control VoiceOver.ActionGestureMute or unmute VoiceOverThree-finger double tap.If both VoiceOver and Zoom are turned on, use the three-finger triple-tap gesture.Turn the screen curtain on or off(When the screen curtain is on, the screen contents are active even though the display is black and appears to be turned off.)Three-finger triple tap.If both VoiceOver and Zoom are turned on, use the three-finger quadruple-tap gesture.Use a standard gestureDouble-tap and hold your finger on the screen until you hear three rising tones, then make the gesture.

React Native Image Props &PropertyTypeDefaultDescriptionuriString'' (empty string)The image's URI, which can be overridden by the source prop.minScaleNumber1The minimum scale allowed for zooming.maxScaleNumber5The maximum scale allowed for zooming.doubleTapScaleNumber3The value of the image scale when a double-tap gesture is detected.maxPanPointersNumber2The maximum number of pointers required to enable panning.isPanEnabledBooleantrueDetermines whether panning is enabled within the range of the minimum and maximum pan pointers.isPinchEnabledBooleantrueDetermines whether pinching is enabled.isSingleTapEnabledBooleanfalseEnables or disables the single tap feature.isDoubleTapEnabledBooleanfalseEnables or disables the double tap feature. When enabled, this feature prevents automatic reset of the image zoom to its initial position, allowing continuous zooming. To return to the initial position, double tap again or zoom out to a scale level less than 1.onInteractionStartFunctionundefinedA callback triggered when the image interaction starts.onInteractionEndFunctionundefinedA callback triggered when the image interaction ends.onPinchStartFunctionundefinedA callback triggered when the image pinching starts.onPinchEndFunctionundefinedA callback triggered when the image pinching ends.onPanStartFunctionundefinedA callback triggered when the image panning starts.onPanEndFunctionundefinedA callback triggered when the image panning ends.onSingleTapFunctionundefinedA callback triggered when a single tap is detected.onDoubleTapFunctionundefinedA callback triggered when a double tap gesture is detected.onProgrammaticZoomFunctionundefinedA callback function that is invoked when a programmatic zoom event occurs.onResetAnimationEndFunctionundefinedA callback triggered upon the completion of the reset animation. It accepts two parameters: finished and values. The finished parameter evaluates to true if all animation values have successfully completed the reset animation; otherwise, it is false, indicating interruption by another gesture or unforeseen circumstances. The values parameter provides additional detailed information for each animation value.ImageZoom RefPropertyTypeDescriptionresetFunctionResets the image zoom, restoring it to its initial position and scale level.zoomFunctionZoom in the image to a given point (x, y) at a given scale level. Calls the reset method if the given scale level is less or equal to 1.ChangelogPlease refer to the Releases section on the GitHub repository. Each release includes a detailed list of changes made to the library, including bug fixes, new features, and any breaking changes. We recommend reviewing these changes before updating to a new version of the library to ensure a smooth transition.TroubleshootingNot working on android?Usage with modals on AndroidAuthorSupportFor ongoing maintenance and updates, your support is greatly appreciatedIf you need further assistance, feel free to reach out to me by email at @likashefi.LicenseThe library is licensed under the MIT License.ReadmeKeywordsphotoimagepicturezoompinchpanreanimatedgestureinstagramreactreact-nativereact-native-image-zoomreact-native-zoomreact-native-imageimage-zoomzoom-imagezoomable-imagezoomablejavascriptui-librnlikashefqetlikashefi

Intranets and other internal services when they are outside of the internal network, for example, when they are travelling. VPN connections can be set up in many ways, depending on the network. Some networks may require you to transfer and install a security certificate in your phone. See Connecting your phone to a computer on page 121 for more information on how to transfer content to your phone. Page 80: Web Browser Web browser Use your web browser to view and navigate web pages, add pages as bookmarks, and save pages for offline viewing. You can open up to 16 windows at the same time and switch among them easily. You can also request the desktop version of a web page if you don't want to view the mobile version. Page 81: Managing Bookmarks To zoom in or out on a web page Use one of the following methods to zoom in or out on a web page: • Double-tap to zoom in on the web page, or double-tap again to zoom out. • Touch an area of the page with two fingers at once and spread them apart to zoom in, or pinch them together to zoom out. Page 82 To bookmark a web page While you are viewing the web page, press Tap Save to bookmarks. If desired, edit the bookmark. When you're done, tap OK. To open a bookmark When the browser is open, flick downward on the screen to make the search and address bar appear. Page 83: Managing Text And Images Managing text and images To find text on a web page When you are viewing a web page, press Tap Find on page. Enter your search text. Characters that match your search get highlighted on the web page. Tap the up or down arrows to go to the previous or next highlighted item. to close the search bar. Page 84: Downloading From The Web Downloading from the web You can download applications and content when you browse the web using the web browser in your phone. Usually you have to touch a download link for the desired file and the download then starts automatically. To view your downloaded files From your Home screen, tap Find and tap... Page 85 Auto-filling text Auto-filling allows you to automatically enter data such as names and addresses on various web forms, so you don’t have to enter the