V2EX = way to explore
V2EX 是一个关于分享和探索的地方
现在注册
已注册用户请  登录
V2EX 提问指南
mogutouer
V2EX  ›  问与答

有没有一种图形界面写 HTML 的工具?

  •  
  •   mogutouer · 2018-09-08 17:07:23 +08:00 · 6779 次点击
    这是一个创建于 2251 天前的主题,其中的信息可能已经有所发展或是发生改变。
    不知道大家有没有用过 Xcode 的 Storyboard 编辑,里面可以根据不同的屏幕尺寸( ipad iphone )和横竖,以及 Auto Layout 设置 UI 的排布和各种相对关系,虽然用起来有点繁琐,但至少只靠拖动和设定规则就能搞定所有 UI 对所有界面的自动伸缩布局还有各个控件之间的关系。

    最近有很多设计稿需要给 PHP 去做,无奈 PHP 对于前端又不太熟,设计也不懂代码,在把设计文件变为 HTML 这个过程是非常繁琐的,基于 CSS 的功能,要实现上述的效果完全手动写代码既繁琐又要不停的调整。

    不知道有没有类似的图形化的工具,可以实现设计稿按照规则调整 UI 自动生成 HTML,以适合不同的屏幕尺寸。
    诸如 左右边距固定中间拉伸扩展,根据屏幕大小按比例缩放, 高度宽度是某个其他元素的百分之多少,横屏横向布局竖屏竖向排列之类常用的 UI 布局规则。

    用过 sketch 的几个自动生成 HTML 插件,都无法实现元素相对其他元素的大小位置比例,也没办法实现靠下靠右固定位置之类的功能。

    27 条回复    2018-09-10 02:45:56 +08:00
    night98
        1
    night98  
       2018-09-08 17:10:37 +08:00 via Android
    dw?
    mogutouer
        2
    mogutouer  
    OP
       2018-09-08 17:15:42 +08:00
    @night98 #1 对哦,忘记这个了,我去试用一下看看
    mogutouer
        3
    mogutouer  
    OP
       2018-09-08 17:30:10 +08:00
    @night98 #1 dw 还是要非常熟悉 css 才行
    delectate
        4
    delectate  
       2018-09-08 17:35:38 +08:00   ❤️ 1
    FrontPage?
    hhsuan
        5
    hhsuan  
       2018-09-08 17:38:53 +08:00 via Android   ❤️ 1
    @delectate 这玩意还存在吗?
    Wolther47
        6
    Wolther47  
       2018-09-08 17:41:59 +08:00 via iPad
    hyper ?
    mcoo1997
        7
    mcoo1997  
       2018-09-08 18:00:37 +08:00 via Android
    马克吐温
    waldentree
        8
    waldentree  
       2018-09-08 18:41:54 +08:00 via Android   ❤️ 1
    wix.com? 不知是否是楼主所需要的
    alvin666
        9
    alvin666  
       2018-09-08 19:07:11 +08:00 via Android
    Frontpage 哈哈哈想起来小学用这个做网页,和 PPT 一样,不过早都不更新了
    zhzer
        10
    zhzer  
       2018-09-08 19:09:13 +08:00 via Android
    小学的时候用 word 写过网页……
    cctrv
        11
    cctrv  
       2018-09-08 19:25:17 +08:00 via iPhone
    Sketch 有導出 HTML 的插件,就是不清楚可用性如何。
    https://www.animaapp.com/
    AxtonYao
        12
    AxtonYao  
       2018-09-08 19:27:50 +08:00 via Android
    CloudnuY
        13
    CloudnuY  
       2018-09-08 20:10:40 +08:00
    网页三剑客?
    learnshare
        14
    learnshare  
       2018-09-08 20:13:44 +08:00
    需要一个前端外包
    ydirel
        15
    ydirel  
       2018-09-08 20:48:30 +08:00 via iPhone
    。。。。Dreamweaver? 拖一拖就行了?
    dcatfly
        16
    dcatfly  
       2018-09-08 21:16:25 +08:00
    设计多套然后用 sketch 生成多套?或者楼上的 WIX,这个不一定能完全到达你想要的效果。。有些功能也需要有一定的编程能力。
    hing
        17
    hing  
       2018-09-08 22:16:17 +08:00   ❤️ 1
    sketch2code
    微软的,开源
    designer
        18
    designer  
       2018-09-08 22:27:45 +08:00 via iPhone
    有没有一种设计软件自动实现产品想法的工具?
    最近做设计累到了。
    Cu635
        19
    Cu635  
       2018-09-09 00:15:00 +08:00
    frontpage?
    dreamweaver?
    WildCat
        20
    WildCat  
       2018-09-09 07:39:41 +08:00 via iPhone
    framer X
    input2output
        21
    input2output  
       2018-09-09 08:35:06 +08:00
    lneoi
        22
    lneoi  
       2018-09-09 08:41:31 +08:00
    微软不是刚开源一个吗
    xenme
        23
    xenme  
       2018-09-09 08:43:46 +08:00 via iPhone
    Word
    😄
    matsuijurina
        24
    matsuijurina  
       2018-09-09 10:19:02 +08:00
    @AxtonYao 飞冰...这名字取得好疯狂
    Tompes
        25
    Tompes  
       2018-09-09 10:19:39 +08:00
    Axure
    dalieba
        26
    dalieba  
       2018-09-10 02:31:14 +08:00 via Android
    dalieba
        27
    dalieba  
       2018-09-10 02:45:56 +08:00 via Android
    关于   ·   帮助文档   ·   博客   ·   API   ·   FAQ   ·   实用小工具   ·   2674 人在线   最高记录 6679   ·     Select Language
    创意工作者们的社区
    World is powered by solitude
    VERSION: 3.9.8.5 · 27ms · UTC 15:38 · PVG 23:38 · LAX 07:38 · JFK 10:38
    Developed with CodeLauncher
    ♥ Do have faith in what you're doing.