ReactNative实现宽度变化实现的动画效果

效果如上图所示,通过修改设备宽度实现动画效果

import React, {useRef, useEffect, useState} from 'react';
import {Animated, Text, View, Image} from 'react-native';const FadeInView = props => {const fadeAnim = useRef(new Animated.Value(0)).current;React.useEffect(() => {Animated.timing(fadeAnim, // 动画中的变量值{toValue: props.currentWidth, // duration: props.durationTime, // 让动画持续一段时间//  Style property 'width' is not supported by native animated moduleuseNativeDriver: false,},).start(); // 开始执行动画}, [props.currentWidth]);return (<Animated.View // 使用专门的可动画化的View组件style={{...props.style,width: fadeAnim, // 将宽度绑定到动画变量值}}></Animated.View>);
};// 然后你就可以在组件中像使用`View`那样去使用`FadeInView`了
export default props => {return (<FadeInViewdurationTime={props.durationTime}currentWidth={props.currentWidth}style={{height: 310, backgroundColor: 'pink'}}></FadeInView>);
};

使用的代码如下

<LayoutAnimatedWidthcurrentWidth={this.state.currentWidth}durationTime={this.state.durationTime}>
</LayoutAnimatedWidth>

PS:注意上面的代码和截图不一致;但是代码是可以实现上面的效果的。

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.rhkb.cn/news/251816.html

如若内容造成侵权/违法违规/事实不符,请联系长河编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

list基本使用

list基本使用 构造迭代器容量访问修改 list容器底层是带头双向链表结构&#xff0c;可以在常数范围内在任意位置进行输入和删除&#xff0c;但不支持任意位置的随机访问&#xff08;如不支持[ ]下标访问&#xff09;&#xff0c;下面介绍list容器的基本使用接口。 template <…

k8s学习-Kubernetes的网络

Kubernetes作为编排引擎管理着分布在不同节点上的容器和Pod。Pod、Service、外部组件之间需要⼀种可靠的方找到彼此并进行通信&#xff0c;Kubernetes网络则负责提供这个保障。 1.1 Kubernetes网络模型 Container-to-Container的网络 当Pod被调度到某个节点&#xff0c;Pod中…

ARM PAC指针认证的侧信道攻击——PACMAN安全漏洞

目录 Q1. PACMAN论文的内容是什么&#xff1f; Q2. Arm处理器是否存在漏洞&#xff1f; Q3. 受Arm合作伙伴架构许可设计的处理器实现是否受到影响&#xff1f; Q4. Cortex-M85受到影响吗&#xff1f; Q5. Cortex-R82受到影响吗&#xff1f; Q6. 指针认证如何保护软件&…

Python 实现 五子棋小游戏【附源码】

引言 五子棋是一种古老而深受欢迎的策略游戏&#xff0c;它具有简单的规则和无穷的变化。作为一种传统的中国棋类游戏&#xff0c;五子棋已经在世界范围内流行起来&#xff0c;并成为智力挑战和休闲娱乐的优秀选择。 规则和玩法&#xff1a; 五子棋使用一个15x15的棋盘&#x…

MIMIC数据库, 使用Python研究万古霉素的剂量 (一)

一、万古霉素 是一种杀菌型 抗生素&#xff0c;抑制细菌细胞壁的合成 万古霉素对以下细菌有效&#xff1a; 大多数革兰阳性球菌和杆菌有抗菌活性&#xff0c;包括几乎所有耐青霉素和头孢菌素的 Staphylococcus aureus 和凝固酶阴性葡萄球菌株 许多菌株 肠球菌 &#xff08;…

【Java报错】显示错误“Error:java: 程序包org.springframework.boot不存在“

使用idea运行项目&#xff0c;显示错误信息如下&#xff1a; 原因是&#xff1a;idea配置的maven加载不到autoconfigure。 解决方案一&#xff1a; 第6步绕过证书语句如下&#xff1a; -Dmaven.wagon.http.ssl.insecuretrue -Dmaven.wagon.http.ssl.allowalltrue 打开终端&am…

2V2无人机红蓝对抗仿真

两架红方和蓝方无人机分别从不同位置起飞&#xff0c;蓝方无人机跟踪及击毁红方无人机 2020a可正常运行 2V2无人机红蓝对抗仿真资源-CSDN文库

【并发编程】原子累加器

&#x1f4dd;个人主页&#xff1a;五敷有你 &#x1f525;系列专栏&#xff1a;并发编程 ⛺️稳重求进&#xff0c;晒太阳 JDK8之后有专门做累加的类&#xff0c;效率比自己做快数倍以上 累加器性能比较 参数是方法 // supplier 提供者 无中生有 ()->结果// func…

ElasticSearch搜索与分析引擎-Linux离线环境安装教程

目录 一、下载安装包 网盘链接: 二、安装流程及遇到的问题和解决方案 &#xff08;1&#xff09;JDK安装 &#xff08;2&#xff09;Elasticsearch安装 &#xff08;3&#xff09;Kibana安装 ​&#xff08;4&#xff09;Ik分词器安装 三、启动过程中的问题 &#xff…

zabbix监控mariadb数据库

zabbix监控mariadb数据库 1.创建监控用户及授权 [rootchang ~]# mysql -uroot -p123qqq.A MariaDB [(none)]> CREATE USER monitor% IDENTIFIED BY 123qqq.A; MariaDB [(none)]> GRANT REPLICATION CLIENT,PROCESS,SHOW DATABASES,SHOW VIEW ON *.* TO monitor%; Maria…

【复现】WordPress html5-video-player SQL 注入漏洞_39

目录 一.概述 二 .漏洞影响 三.漏洞复现 1. 漏洞一&#xff1a; 四.修复建议&#xff1a; 五. 搜索语法&#xff1a; 六.免责声明 一.概述 在WordPress中播放各种视频文件。一个简单&#xff0c;可访问&#xff0c;易于使用和完全可定制的视频播放器&#xff0c;适用于所…

Android SELinux:保护您的移动设备安全的关键

Android SELinux&#xff1a;保护您的移动设备安全的关键 1 引言 移动设备在我们的生活中扮演着越来越重要的角色&#xff0c;我们几乎把所有重要的信息都存储在这些设备上。然而&#xff0c;随着移动应用程序的数量不断增加&#xff0c;安全性也变得越来越关键。这就是为什么…

Android14之Selinux报错:unknown type qemu_device at token (一百八十三)

简介&#xff1a; CSDN博客专家&#xff0c;专注Android/Linux系统&#xff0c;分享多mic语音方案、音视频、编解码等技术&#xff0c;与大家一起成长&#xff01; 优质专栏&#xff1a;Audio工程师进阶系列【原创干货持续更新中……】&#x1f680; 优质专栏&#xff1a;多媒…

PyTorch使用

前言 系统环境&#xff1a;win10 使用Anaconda&#xff0c;Anaconda的安装自行百度。 conda 23.7.4 目录 前言 创建虚拟环境 1、查看当前有哪些虚拟环境 2、创建虚拟环境pytorch 3、激活及关闭pytorch虚拟环境 4、删除pytorch虚拟环境 使用yolov5测试 1、切换至yolo…

ubuntu离线安装k8s

目录 一、前期准备 二、安装前配置 三、安装docker 四、安装cri-dockerd 五、部署k8s master节点 六、整合kubectl与cri-dockerd 七、网络等插件安装 八、常见问题及解决方法 一、前期准备 ①ubuntu系统 本地已安装ubuntu系统&#xff0c;lsb_release -a命令查看版本信…

《vtk9 book》 官方web版 第3章 - 计算机图形基础 (2 / 6)

3.4 表面特性 当光线穿过空间时&#xff0c;其中一些光线会与我们的物体相交。当这种情况发生时&#xff0c;光线会与物体表面相互作用&#xff0c;产生一种颜色。部分由此产生的颜色实际上并不是由直接光线产生的&#xff0c;而是来自其他物体反射或散射的环境光。环境光照模型…

物联网与智慧景区的未来:机遇与挑战并存

随着科技的不断发展&#xff0c;物联网技术在智慧景区中的应用越来越广泛&#xff0c;为旅游业带来了巨大的变革。然而&#xff0c;在物联网与智慧景区的未来发展中&#xff0c;机遇与挑战并存。本文将探讨物联网与智慧景区面临的机遇和挑战&#xff0c;并提出应对措施&#xf…

Spring框架——主流框架

文章目录 Spring(轻量级容器框架)Spring 学习的核心内容-一图胜千言IOC 控制反转 的开发模式Spring快速入门Spring容器剖析手动开发- 简单的 Spring 基于 XML 配置的程序课堂练习 Spring 管理 Bean-IOCSpring 配置/管理 bean 介绍Bean 管理包括两方面: Bean 配置方式基于 xml 文…

网络空间内生安全数学基础(2)——编码信道数学模型

目录 &#xff08;零&#xff09;这篇博客在干什么&#xff08;一&#xff09;内生安全与香农信道编码定理&#xff08;二&#xff09;基本定义&#xff08;三&#xff09;编码信道存在定理&#xff08;三.壹&#xff09;编码信道存在第一定理&#xff08;三.贰&#xff09;编码…

[python] 过年燃放烟花

目录 新年祝福语 一、作品展示 二、作品所用资源 三、代码与资源说明 四、代码库 五、完整代码 六、总结 新年祝福语 岁月总是悄然流转&#xff0c;让人感叹时间的飞逝&#xff0c;转眼间又快到了中国传统的新年&#xff08;龙年&#xff09;。 回首过去&#xf…