V2EX = way to explore
V2EX 是一个关于分享和探索的地方
现在注册
已注册用户请  登录
cpalead
V2EX  ›  Android

请教下如何获取网站手机版 ui 数据

  •  
  •   cpalead · 2022-11-11 10:14:54 +08:00 · 9185 次点击
    这是一个创建于 743 天前的主题,其中的信息可能已经有所发展或是发生改变。
    现在要做一个 app ,样式跟一个网站的手机版类似,没有设计师,我自己怎么获取手机版上面元素的大小和文字大小的事情,我需要把这些大小切换到安卓手机上,这个对应关系是怎么样的呢?
    感谢各位 v 友
    17 条回复    2022-11-13 13:00:49 +08:00
    lybcyd
        1
    lybcyd  
       2022-11-11 10:41:18 +08:00
    PC chrome 开发者工具 - 设备工具栏,设置成移动端 UA
    cpalead
        2
    cpalead  
    OP
       2022-11-11 10:47:13 +08:00
    @lybcyd 这个搞了,而且切换设备的旁边那个按钮可以选元素,看到元素的大小这些东西,还有更高效的东西吗
    Rache1
        3
    Rache1  
       2022-11-11 11:22:35 +08:00
    你可能需要这个

    stevenlei/spacingjs: A JavaScript utility for measuring the spacing between elements on webpage.
    https://github.com/stevenlei/spacingjs
    Rache1
        4
    Rache1  
       2022-11-11 11:30:29 +08:00
    还有个 Chrome 插件,ViaBug

    VisBug - Chrome 应用商店
    https://chrome.google.com/webstore/detail/visbug/cdockenadnadldjbbgcallicgledbeoc
    Rache1
        6
    Rache1  
       2022-11-11 11:44:35 +08:00
    @shawndev 乖乖,这也太秀了 😂
    cpstar
        7
    cpstar  
       2022-11-11 11:46:09 +08:00
    我只想说,关键是调好 safari 这一新时代 ie11
    cpalead
        8
    cpalead  
    OP
       2022-11-11 11:50:39 +08:00
    @Rache1 VisBug 这个很好用,但是有个问题,我是预览的手机版的网页,这个就用不了了,在电脑端的网页,我点开,用这个 VisBug 是很方便的,但是我要测手机端浏览器网站是数据
    我现在看手机端网页的办法是 chrome 的 f12 设置模拟的设备看的
    corcre
        9
    corcre  
       2022-11-11 11:52:18 +08:00
    chrome 的话, 要不要考虑一下远程调试然后直接在 pc 端获取你需要的数据
    cpalead
        10
    cpalead  
    OP
       2022-11-11 12:13:04 +08:00
    @corcre 啥叫远程调试?我现在是想做个 app 界面跟这个网站的手机端页面看起来一样
    cpalead
        11
    cpalead  
    OP
       2022-11-11 12:28:07 +08:00
    @shawndev 这个总是提示网站连接失败,我让它解析百度也是连接失败。怎么办?谷歌了一下,也没有解决办法
    cpalead
        12
    cpalead  
    OP
       2022-11-11 12:36:38 +08:00
    @shawndev 我挂个代理,貌似成功了
    corcre
        13
    corcre  
       2022-11-11 13:06:38 +08:00
    @cpalead http://www.ruanyifeng.com/blog/2019/06/android-remote-debugging.html
    就是用 chrome 连上你的安卓设备然后可以在 pc 端看到手机页面的信息, 但是我只了解安卓可以这么做, 别的不太清楚
    corcre
        14
    corcre  
       2022-11-11 13:18:47 +08:00
    @cpalead 反正就是在 pc 端打开了移动端 chrome 的 DevTools...
    cpalead
        15
    cpalead  
    OP
       2022-11-11 13:24:08 +08:00
    @corcre 这个是调试的办法,我是想 copy ui ,用不上,还是谢谢
    krapnik
        16
    krapnik  
       2022-11-11 13:41:38 +08:00
    happy61
        17
    happy61  
       2022-11-13 13:00:49 +08:00
    @krapnik 那如果不是 Copy React 代码,有直接 copy 普通的 html 的么
    关于   ·   帮助文档   ·   博客   ·   API   ·   FAQ   ·   实用小工具   ·   2349 人在线   最高记录 6679   ·     Select Language
    创意工作者们的社区
    World is powered by solitude
    VERSION: 3.9.8.5 · 22ms · UTC 16:11 · PVG 00:11 · LAX 08:11 · JFK 11:11
    Developed with CodeLauncher
    ♥ Do have faith in what you're doing.