¿Una forma sencilla de crear la interfaz de usuario de Android? [cerrado]

82

¿Existe una herramienta o un sitio web que pueda ayudarme a crear una interfaz de usuario para una aplicación de Android mediante la función de arrastrar y soltar?

Encontré este sitio, pero ¿quiero saber si hay una herramienta o un sitio web más estable para esto?

hkhalifa
fuente
[Actualización] Android Studio está en versión beta pero parece prometedor .. developer.android.com/sdk/installing/studio.html
Syed Qarib

Respuestas:

46

Permítame ser yo quien le dé un poco de realidad a este tema. No existe una buena herramienta GUI para trabajar con Android. Si viene de un entorno de GUI de aplicación nativa como, por ejemplo, Delphi, la experiencia del usuario con el editor ADK y DroidDraw le decepcionará mucho. He intentado varias veces trabajar con DroidDraw de una manera productiva, y siempre vuelvo a rodar el XML a mano.

El ADK es un buen punto de partida, pero no es fácil de usar. Colocar componentes dentro de diseños es una pesadilla. DroidDraw parece que sería fantástico, pero ni siquiera puedo abrir diseños XML funcionales existentes con él. De alguna manera pierde la mitad del diseño y no puede extraer las imágenes que he especificado para botones, fondos, etc.

La cruda realidad es que el espacio para desarrolladores de Android tiene una gran necesidad de una herramienta de desarrollo GUI robusta, flexible y fácil de usar similar a las que se utilizan para el desarrollo .NET y Delphi.

Todd Grigsby
fuente
9
Estoy de acuerdo. ¡Trabajar con diseños en Android es un verdadero dolor de cabeza!
Kris B
4
Me gustaría que abandonaran XML por completo a favor de CSS cuando se trata de estilo.
WKS
Todo el marco de la GUI de Android debe funcionar, rápido. Simplemente no es utilizable.
G_V
@G_V: Si te refieres a los controles visuales en lugar del IDE, me gustaría diferir. Lo he estado usando durante algunos años y me siento bastante cómodo con él.
Todd Grigsby
28

El complemento de herramientas de desarrollo de Android (ADT) para Eclipse incluye un editor visual para archivos de diseño de aplicaciones de Android:

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

Josef Pfleger
fuente
4
Especialmente el que viene con Android SDK 1.5, es mucho mejor que DroidDraw.
Isaac Waller
8
Si alguien tiene problemas para encontrar esto (sé que lo hice), simplemente abra su main.xml en Eclipse. Si eso falla, haga clic derecho en él, Abrir con> Editor de diseño de Android. Si eso falla, es posible que su ADT no esté instalado correctamente.
MSpeed
12
El editor visual de Eclipse apesta. Realmente es inhibidor al permitir que el usuario disponga las cosas correctamente.
IgorGanapolsky
@IgorGanapolsky ¿qué es mejor que Eclipse ?, ¿qué sugieres?
Mahmoud Farahat
1
Personalmente, no encuentro el constructor de GUI de ADT fácil ni intuitivo de usar. En serio, ese constructor hace que Google se vea mal.
Shiouming
8

La forma más sencilla es con REBOL 3:

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

Aquí hay 10 programas de demostración completamente funcionales, con GUI. Estos se ejecutan en sistemas operativos Android y de escritorio, utilizando exactamente el mismo código:

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."]]
NickA
fuente
1
+1 Bien, no quiero ser sarcástico, pero parece que necesito otra maestría para descifrar este código. Parece simple pero me dio la sensación de que estoy escribiendo todo esto en asamblea.
Neon Warge
7

DroidDraw parece ser muy útil. Tiene una interfaz limpia y sencilla y es un programa gratuito. Disponible para Windows, Linux y Mac OS X. Aconsejo una donación.

Si no le gusta, debería echar un vistazo a este sitio . Hay algunas otras opciones y otras herramientas útiles.

rlc
fuente
No hace nada para el desarrollo nativo de Android con guis no estáticos sin conexión.
G_V
Parece que DroidDraw está muerto. El enlace está activo pero muestra la página web del host del dominio. Está vacante ~
Neon Warge
6

También puedes probar esto . Si te gusta el concepto de controlador de vista de modelo y la creación rápida de prototipos, diría que te gustará la idea detrás de él;)

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

La interfaz de usuario generada (código a continuación):

ingrese la descripción de la imagen aquí

El código completo para crear esta interfaz de usuario de Android :

ingrese la descripción de la imagen aquí

Lo uso en aplicaciones reales, no solo para la creación rápida de prototipos o diálogos y está bien probado a lo largo de los años. El concepto se basa en el principio de control de vista del modelo y para los escenarios más comunes hay componentes listos para usar que automáticamente se ven correctos en cualquier dispositivo. No digo que deba usarse para ninguna interfaz de usuario (por ejemplo, las vistas de lista deben hacerse a mano) pero para la mayoría de los casos de uso esto debería ser bastante útil;) Ah, y siéntase libre de bifurcarlo y mejorarlo aún más si lo desea

Simón
fuente
4

Droiddraw es bueno. Lo he estado usando desde hace mucho tiempo y aún no he enfrentado ningún problema (aunque a veces se bloquea, pero está bien)

perdido en el transito
fuente
3
"a veces se bloquea, pero está bien", ese también es mi mantra;)
demoncodemonkey
"A veces se bloquea, pero está bien" - lol. eso me hizo reír mucho: D
mr5
1

http://www.appinventor.mit.edu/

La creación de una aplicación App Inventor comienza en su navegador, donde usted diseña cómo se verá la aplicación. Luego, al igual que encajando las piezas de un rompecabezas, configura el comportamiento de su aplicación. Mientras tanto, a través de una conexión en vivo entre su computadora y su teléfono, su aplicación aparece en su teléfono.

Davek804
fuente
1

Ésta es una vieja pregunta, que desafortunadamente incluso varios años después no tiene una buena solución. Acabo de migrar una aplicación de iOS (Obj C) a Android. El mayor problema no era el código de back-end (para muchos / la mayoría de la gente, si puede codificar en Obj C, puede codificar en Java), sino portar las interfaces nativas. Lo que Todd dijo anteriormente, el diseño de la interfaz de usuario sigue siendo un dolor total. En mi experiencia, el medio más rápido para desarrollar una interfaz de usuario confiable que admita múltiples formatos, etc. es en buen HTML.

Nostradamus
fuente
0

Descubrí que el uso de http://pencil.evolus.vn/ junto con las plantillas de lápiz del proyecto http://code.google.com/p/android-ui-utils/ funciona excepcionalmente bien. Muy simple de usar, es muy fácil simular diseños elaborados

redsolo
fuente
Quizás me falta algo, pero, por lo que puedo ver, solo puede colocar cosas en un Nexus y no estoy seguro de cómo obtener el código xml para main.xml
the_new_mr
0

No digo que esta sea la mejor manera de hacerlo, pero es bueno tener opciones. Necessitas es un proyecto que transfiere Qt a Android. Todavía se encuentra en sus primeras etapas y carece de funciones completas, pero para aquellos que conocen Qt y no quieren molestarse con la terrible falta de buenas herramientas para la interfaz de usuario de Android, sería prudente al menos considerar usar esto.

tylerthemiler
fuente