稿APP自动化测试(11)-利用swip滑动屏幕

该文介绍了如何在Appium中进行屏幕滑动操作,包括向上、向下、向左和向右滑动。通过获取屏幕的宽度和高度,定义滑动起点和终点坐标,调用WebDriver的滑动方法来实现。滑动代码已封装在SwipeClass类中,根据传入的方向参数执行相应方向的滑动操作。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

        在操作app的时候,我们操作得最多的是定位元素,然后直接对元素进行操作,但有的时候需要滑动屏幕,此时就要用到swip了

一、屏幕坐标介绍

如上图,最左上角的坐标为(0,0),而右下角是(x,y),x和y具体是多少我们不知道,需要用driver.get_window_size()活动宽和高,然后再进行移动

二、滑动实现代码

直接上代码,已经封装好的滑动屏幕代码

'''
实现屏幕的滑动
1、首先要活动屏幕宽和高的坐标
2、根据X或Y轴的移动实现屏幕滑动'''

from common.ComLog import LOGGER
class SwipeClass:
    """屏幕滑动"""
    def __init__(self,driver):
        """屏幕滑动_

        Args:
            driver (_type_): Appium 的 WebDriver对象
        """
        self.driver = driver
        #获取屏幕的宽和高
        size = self.driver.get_window_size()
        LOGGER.info(size)
        print(size)
        self.width = size["width"]
        self.height = size["height"]
        
    def swipe_up(self):
        """向上移动
        """
        LOGGER.info("向上移动")
        #x轴保持不变,y轴从0.75(下方)移动到0.25(上方),实现屏幕向上滑动
        start_x = self.width * 0.5
        start_y = self.height * 0.75
        end_x = self.width * 0.5
        end_y = self.height * 0.25
        self.driver.swip(start_x, start_y, end_x, end_y, 1000)
        
    def swipe_down(self):
        """向下移动
        """
        LOGGER.info("向下移动")
        #x轴保持不变,y轴从0.25(上方)移动到0.75(下方),实现屏幕向下滑动
        start_x = self.width * 0.5
        start_y = self.height * 0.25
        end_x = self.width * 0.5
        end_y = self.height * 0.75
        self.driver.swip(start_x, start_y, end_x, end_y, 1000)
        
    def swipe_left(self):
        """向左移动
        """
        LOGGER.info("向左移动")
        #Y轴保持不变,X轴从0.75(右侧)移动到0.25(左侧),实现屏幕向左滑动
        start_x = self.width * 0.75
        start_y = self.height * 0.5
        end_x = self.width * 0.25
        end_y = self.height * 0.5
        self.driver.swip(start_x, start_y, end_x, end_y, 1000)
        
    def swipe_right(self):
        """向右移动
        """
        LOGGER.info("向右移动")
        #Y轴保持不变,X轴从0.25(左侧)移动到0.75(右侧),实现屏幕向右滑动
        start_x = self.width * 0.25
        start_y = self.height * 0.5
        end_x = self.width * 0.75
        end_y = self.height * 0.5
        self.driver.swip(start_x, start_y, end_x, end_y, 1000)
        
    def swipe_by_director(self,director):
        """滑动屏幕,根据传入的方向实现不同方向滑动

        Args:
            director (str): 滑动方向
        """
        if director == "up":
            self.swipe_up()
        elif director == "down":
            self.swipe_down()
        elif director == "left":
            self.swipe_left()
        elif director == "right":
            self.swipe_right()
        else:
            LOGGER.warning("{} 该方向移动不支持".format(director))
            return False

 

### 实现 `van-swipe` 轮播图组件的滑动效果 为了确保 `van-swipe` 组件能够正常工作并实现预期的滑动效果,需要注意几个关键点: #### 外部容器控制显示隐藏的方式 当外部标签使用 `v-show` 控制显示隐藏时,`van-swipe` 组件可能会遇到无法轮播的问题。这是因为 `v-show` 只是通过 CSS 来切换元素的可见性,并不会重新渲染 DOM 结构,这可能导致某些初始化逻辑未能正确执行[^1]。 ```html <!-- 不推荐 --> <div v-show="isVisible"> <van-swipe> <!-- swipe items here --> </van-swipe> </div> <!-- 推荐 --> <div v-if="isVisible"> <van-swipe :style="{ width: '300px' }"> <!-- 设置固定宽度 --> <!-- swipe items here --> </van-swipe> </div> ``` #### 容器尺寸设定 为了避免因父级元素未指定宽高而导致子组件布局异常的情况,在使用 `v-if` 替代 `v-show` 的基础上还需要考虑为 `van-swipe` 自身或其外围包裹一层具有明确大小定义的 HTML 标签来限定展示区域范围,防止自动拉伸变形影响视觉呈现效果[^2]。 #### 子项间距处理 对于希望在每张幻灯片之间加入间隔的需求场景下,直接向单个 `van-swipe-item` 应用内边距并不是一个好的实践方案;因为这样做会使图片被裁剪掉一部分而看不到完整的画面内容。相反地,应该利用官方文档里提到的支持属性如 `loop`, `autoplay` 等配置选项来自定义过渡动画行为以及调整相邻卡片间的距离感[^3]。 ```javascript <template> <van-swipe class="my-swipe" :autoplay="3000" indicator-color="white"> <van-swipe-item>Content 1</van-swipe-item> <van-swipe-item>Content 2</van-swipe-item> <van-swipe-item>Content 3</van-swipe-item> </van-swipe> </template> <style scoped> .my-swipe .van-swipe-item { color: #fff; font-size: 20px; line-height: 150px; text-align: center; background-color: #39a9ed; /* Example style */ } /* 如果确实需要设置 margin, 建议通过样式类而不是直接加到 item 上 */ .custom-margin { padding-left: 10px !important; padding-right: 10px !important; } </style> ```
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

六天测试工程师

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值