首页 > 其他分享 >学习 React Native——可按下的触控动画

学习 React Native——可按下的触控动画

时间:2022-09-21 11:34:47浏览次数:82  
标签:动画 触摸 React 触控 组件 Native

学习 React Native——可按下的触控动画

Pressable 是 React Native 应用程序中处理触摸的最新最好的工具,句柄 新闻 长按 唯一令人讨厌的是,如果用户触摸了按钮,它不会向用户发出任何指示。没有动画反馈或指示可按压组件已被触摸。

为了帮助解决这个问题,我制作了以下可重用组件来包装我的可触摸组件并提供一些关于触摸的动画反馈。

PressableOpacity Wrapper to provide animated feedback for any touchable component

可重用组件使用动画钩子通过动画视图的不透明度来提供触摸反馈。

My animation hook

我将把这个组件和其他一些组件一起添加到我的 react-native-component 库中。准备好后,我会在这里分享给其他人使用。

免责声明:我在这些组件中使用 nativewind 进行样式设置。

结束的想法

接下来我应该做什么教程?我可以写什么反应原生概念、库和其他东西?

访问我的 向上工作 ,跟着我 GitHub 更多面试问题,如果您有任何问题,请给我发消息 推特 .

版权声明:本文为博主原创文章,遵循 CC 4.0 BY-SA 版权协议,转载请附上原文出处链接和本声明

本文链接:https://www.qanswer.top/38376/23362111

标签:动画,触摸,React,触控,组件,Native
From: https://www.cnblogs.com/amboke/p/16715004.html

相关文章

  • 使用 react-spring 开发一个智能暗模式切换按钮
    最近,我重写了博客右上角的深色模式切换按钮。为此,我也学会了学习Figma。虽然技术不难,但收获不少。至少我可以根据猫和老虎设计一些简单的SVG图形。废话不多说,介绍一下我......
  • React 面向组件编程 之 函数式组件
    简单组件和复杂组件的概念如果组件有state(状态)属性,就是复杂组件。如果没有state(状态)属性,就是简单组件。state、props、refs是组件实例的三大核心属性,在之后会逐一进......
  • 四、react-redux(demo可对比redux)
    react-redux调用关系: react-reducdemo1.安装插件:npminstall--savereact-redux2.创建项目:项目模板:https://www.cnblogs.com/lixiuming521125/p/16698004.html......
  • 关于react的渲染原理
    1:父组件里面的子组件,父组件进行render渲染之后,等到子组件render渲染完成之后并且子组件生成了对应的虚拟节点(也就是子组件render执行后,componentDidunMount周期执行完之后),......
  • 如何在 React 中进行 Axios POST 请求?
    如何在React中进行AxiosPOST请求?我们将制作一个AxiosPOST请求创建数据或将数据插入数据库。我们将在POST请求中发送请求参数,并且还将举例发送HTTP标头。在......
  • 我再也不会使用 create-react-app 了。
    我再也不会使用create-react-app了。对于我们必须先学习才能做的事情,我们通过做来学习。在你开始阅读之前,请给我一个关注和分享。如果您正在使用react并在启动新......
  • React Native — REST API 调用
    ReactNative—RESTAPI调用ReactNative/JSShorts的一部分:切中要害|简单的1.0获取fetchAPI是一个现成的JS函数。我们可以使用它在我们的ReactNative......
  • react useMemo、useEffect和 useCallback区别及与 vue 对比
    reactuseMemo和useEffect和useCallbackuseEffecteffect只能在DOM更新后触发useMemo传入useMemo的函数会在渲染期间执行,即在DOM更新前触发的,就像官方所说的,类比......
  • React18 (四) Context,Effect,Reducer和Memo
    代码地址:https://github.com/showkawa/react18-ZeroToOne/tree/main/react031.Context在React中组件间的数据通信是通过props进行的,父组件给子组件设置props,子组件给后代......
  • [通明境 · React架构]通俗地讲React,优雅地理解React
    1前言大家好,我是心锁,一枚23届准毕业生。如果读者阅读过我其他几篇React相关的文章,就知道这次我是来填坑的了原因是,写了两篇解读react-hook的文章后我发现——并不是每......