构建Android UI的简便方法?

hkh*_*ifa 82 user-interface android

是否有工具或网站可以帮助我使用拖放操作为Android应用程序创建UI?

我找到了这个网站,但想知道是否有更稳定的工具或网站?

小智 46

请允许我成为这个主题的一个小现实.使用Android没有好的GUI工具.如果您来自原生应用程序GUI环境(例如Delphi),您会​​对使用ADK编辑器和DroidDraw的用户体验感到遗憾.我已经多次尝试过以高效的方式使用DroidDraw,而且我总是回过头来手动滚动XML.

ADK是一个很好的起点,但它并不容易使用.在布局中定位组件是一场噩梦.DroidDraw看起来很棒,但我甚至无法使用它打开现有的功能性XML布局.它以某种方式丢失了一半的布局,无法拉入我为按钮,背景等指定的图像.

严峻的现实是Android开发人员需要一个灵活,易用,强大的GUI开发工具,类似于用于.NET和Delphi开发的工具.

  • 我同意.在Android中使用布局是一个绝对痛苦的屁股! (9认同)
  • 我希望他们在样式方面完全抛弃XML而支持CSS. (4认同)

Jos*_*ger 28

Eclipse的Android开发工具(ADT)插件包含一个用于Android应用程序布局文件的可视化编辑器:

http://developer.android.com/tools/help/adt.html

  • Eclipse中的可视化编辑器很糟糕.它实际上是在禁止用户正确地放置东西. (12认同)
  • 如果有人发现这个问题(我知道我做了),只需在Eclipse中打开main.xml即可.如果失败,请右键单击它,打开方式> Android布局编辑器.如果失败,则可能无法正确安装ADT. (8认同)
  • 特别是Android SDK 1.5附带的,它比DroidDraw好多了. (4认同)

小智 8

最简单的方法是使用REBOL 3:

http://rebolforum.com/index.cgi?f=printtopic&permalink=Nick25-Aug-2013/10:08:38-7:00&archiveflag=new

这里有10个功能齐全的演示程序,带有GUI.这些在Android 桌面操作系统上运行,使用完全相同的代码:

REBOL []
load-gui
view [text "Hello World!"]


REBOL [title: "Tiny Note Editor"]
do %r3-gui.r3  ; download this file manually or just use load-gui as above
view [
    a1: area
    button "Save" on-action [write %notes.txt get-face a1]
    button "Load" on-action [set-face a1 to-string read %notes.txt]
]


REBOL [title: "Data Entry to CSV File"]
do %r3-gui.r3
view [
    text "First Name:"
    f1: field
    text "Last Name:"
    f2: field
    button "Submit" on-action [
        write/append %cntcts.txt rejoin [
            mold get-face f1 " " mold get-face f2 newline
        ]
        request "" "Saved"
    ]
    a1: area
    button "Load" on-action [set-face a1 to-string read %cntcts.txt]
]


REBOL [title: "Text File Reader (How to use a text list file selector)"]
do %r3-gui.r3
view [
    a1: area
    button "Load" on-action [
        files: read %./
        view/modal [
            text "File Name:"
            t2: text-list files on-action [
                set-face a1 to-string read(to-file pick files get-face t2)
                unview
            ]
        ]
    ]
]


REBOL [title: "List-View (Grid) Example"]
do %r3-gui.r3
view [
    text-table ["1" 200 "2" 100 "3"][
        ["asdf" "a" "4"]
        ["sdfg" "b" "3"]
        ["dfgh" "c" "2"]
        ["fghj" "d" "1"]
    ] 
]


REBOL [title: "Calculator"]
do %r3-gui.r3
stylize [
    btn: button [
        facets: [init-size: 50x50]
        actors: [on-action:[set-face f join get-face f get-face face]]
    ]
]
view [
    hgroup [
        f: field return
        btn "1"  btn "2"  btn "3"  btn " + "  return
        btn "4"  btn "5"  btn "6"  btn " - "  return
        btn "7"  btn "8"  btn "9"  btn " * "  return
        btn "0"  btn "."  btn " / "   btn "=" on-action [
            attempt [set-face f form do get-face f]
        ]
    ]
]


REBOL [title: "Sliding Tile Puzzle"]
do %r3-gui.r3
stylize [
    p: button [
        facets: [init-size: 60x60  max-size: 60x60]
        actors: [
            on-action: [
                t: face/gob/offset
                face/gob/offset: x/gob/offset
                x/gob/offset: t
            ]
        ]
    ]
]
view/options [
    hgroup [ 
        p "8"   p "7"   p "6"   return
        p "5"   p "4"   p "3"   return
        p "2"   p "1"   x: box 60x60 white
    ]
] [bg-color: white]


REBOL [title: "Math Test"]
do %r3-gui.r3
random/seed now
x: does [rejoin [random 10 " + " random 20]]
view [
    f1: field (x)
    text "Answer:"
    f2: field on-action [
        either (get-face f2) = (form do get-face f1) [
            request "Yes!" "Yes!"][request "No!" "No!"
        ]
        set-face f1 x
        set-face f2 ""
        focus f2
    ]
]


REBOL [title: "Minimal Cash Register"]
do %r3-gui.r3
stylize [fld: field [init-size: 80]]   
view [
    hgroup [
        text "Cashier:"   cashier: fld 
        text "Item:"      item: fld 
        text "Price:"     price: fld on-action [
            if error? try [to-money get-face price] [
                request "Error" "Price error" 
                return none
            ]
            set-face a rejoin [
                get-face a mold get-face item tab get-face price newline
            ]
            set-face item copy "" set-face price copy ""
            sum: 0
            foreach [item price] load get-face a [
                sum: sum + to-money price
            ]
            set-face subtotal form sum
            set-face tax form sum * .06
            set-face total form sum * 1.06 
            focus item
        ]
        return
        a: area 600x300
        return
        text "Subtotal:"   subtotal: fld 
        text "Tax:"        tax: fld 
        text "Total:"      total: fld
        button "Save" on-action [
            items: replace/all (mold load get-face a) newline " "
            write/append %sales.txt rejoin [
                items newline get-face cashier newline now/date newline
            ]
            set-face item copy "" set-face price copy "" 
            set-face a copy ""    set-face subtotal copy ""
            set-face tax copy "" set-face total copy ""
        ]
    ]
]


REBOL [title: "Requestors"]
do %r3-gui.r3
x: request/ask "Question" "Do you like this?."
either x = false [print "No!"] [print "Yes!"]
x: request/custom "" "Do you like this?" ["Yay" "Boo"]
either x = false [print "Boo!"] [print "Yay!"]
view [button "Click me" on-action[request "Ok" "You clicked the button."]]
Run Code Online (Sandbox Code Playgroud)


rlc*_*rlc 7

DroidDraw似乎非常有用.它有一个干净,简单的界面,它是一个免费软件.适用于Windows,Linux和Mac OS X.我建议捐款.

如果你不喜欢它,你应该看看这个网站.还有一些其他选项和其他有用的工具.


Sim*_*mon 6

你也可以试试这个.如果您喜欢模型视图控制器概念和快速原型设计,那么我会说你会喜欢它背后的想法;)

SimpleUi(https://github.com/bitstars/SimpleUi)

生成的UI(下面的代码):

在此输入图像描述

创建此Android UI的完整代码:

在此输入图像描述

我在实际应用中使用它,不仅用于快速原型设计或对话,而且多年来经过了充分的测试.该概念基于模型视图控制原理,对于大多数常见情况,可以随时使用在任何设备上自动查看正确的组件.我并不是说它应该用于任何UI(例如listviews应该手工完成),但对于大多数用例来说,这应该非常方便;)哦,随意分叉并进一步改进它如果你想要的话