当前位置: 动力学知识库 > 问答 > 编程问答 >

xml - How to use Android Layout and custom GUI design in this

问题描述:

I'm trying to make customized design and style of widgets in my android app. So can anyone suggest me code how to make this kind of GUI in android using xml or any other code.

Curves in text fields, button styles, lines, checkbox style, rounded facebook button, line between ----OR----- .....


网友答案:

I create this for you with this link

activity_main.xml

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent">

<EditText
    android:id="@+id/editText1"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:background="@drawable/email_shape"
    android:layout_alignParentTop="true"
    android:layout_centerHorizontal="true"
    android:layout_marginTop="40dp"
    android:ems="10"
    android:hint="Email"
    android:paddingLeft="20dp"
    android:inputType="text" >

    <requestFocus />
</EditText>

<EditText
    android:id="@+id/editText2"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_alignLeft="@+id/editText1"
    android:layout_below="@+id/editText1"
    android:layout_marginTop="22dp"
    android:layout_toLeftOf="@+id/button1"
    android:background="@drawable/password_shape"
    android:paddingLeft="20dp"
    android:ems="10"
    android:layout_marginRight="-5dp"
    android:hint="Password" />

<Button
    android:id="@+id/button1"
    android:layout_width="60dp"
    android:layout_height="wrap_content"
    android:layout_alignBottom="@+id/editText2"
    android:layout_alignRight="@+id/editText1"
    android:background="@drawable/go_shape"
    android:text="Go" />

<TextView
    android:id="@+id/textView1"
    android:layout_width="1dp"
    android:layout_height="50dp"
    android:layout_below="@+id/editText2"
    android:layout_centerHorizontal="true"
    android:layout_marginTop="17dp"
    android:background="#ccc" />

<TextView
    android:id="@+id/textView2"
    android:layout_width="wrap_content"
    android:layout_height="1dp"
    android:layout_alignLeft="@+id/editText2"
    android:layout_alignRight="@+id/button1"
    android:layout_below="@+id/textView1"
    android:background="#ccc" />

<TextView
    android:id="@+id/textView3"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_alignBottom="@+id/textView1"
    android:layout_marginBottom="15dp"
    android:layout_toRightOf="@+id/textView1"
    android:text="forgot password ?"
    android:textColor="#555"
    android:layout_marginLeft="10dp" />

<TextView
    android:id="@+id/textView4"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_alignBottom="@+id/textView3"
    android:layout_marginRight="26dp"
    android:layout_toLeftOf="@+id/textView1"
    android:text="remember me"
    android:textColor="#555" />

<Button
    android:id="@+id/button2"
    android:layout_width="30dp"
    android:layout_height="30dp"
    android:layout_alignTop="@+id/textView4"
    android:layout_toLeftOf="@+id/textView4"
    android:text="Button" />

<TextView
    android:id="@+id/textView5"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_below="@+id/textView2"
    android:layout_centerHorizontal="true"
    android:layout_marginTop="17dp"
    android:text="New User Click to"
    android:textColor="#555" />

<TextView
    android:id="@+id/textView6"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_below="@+id/textView5"
    android:layout_centerHorizontal="true"
    android:layout_marginTop="10dp"
    android:text="Sign Up !"
    android:textColor="#F2272D"
    android:textSize="30sp" />

<TextView
    android:id="@+id/textView7"
    android:layout_width="wrap_content"
    android:layout_height="1dp"
    android:layout_alignLeft="@+id/button2"
    android:layout_below="@+id/textView6"
    android:layout_marginTop="22dp"
    android:layout_toLeftOf="@+id/textView8"
    android:background="#ccc"
    android:layout_marginRight="5dp" />

<TextView
    android:id="@+id/textView8"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_below="@+id/textView6"
    android:layout_marginTop="15dp"
    android:layout_toLeftOf="@+id/textView3"
    android:text="or" />

<TextView
    android:id="@+id/textView9"
    android:layout_width="wrap_content"
    android:layout_height="1dp"
    android:background="#ccc"
    android:layout_alignBottom="@+id/textView7"
    android:layout_alignRight="@+id/textView2"
    android:layout_toRightOf="@+id/textView8"
    android:layout_marginLeft="5dp"
    />

<Button
    android:id="@+id/button3"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_alignLeft="@+id/textView2"
    android:layout_alignRight="@+id/textView9"
    android:layout_below="@+id/textView8"
    android:background="@drawable/facebook_shape"
    android:text="facebook" />

email_shape:

<corners
    android:bottomLeftRadius="0dp"
    android:bottomRightRadius="10dp"
    android:topLeftRadius="10dp"
    android:topRightRadius="0dp" />

<solid android:color="#F2F2F2" />


<size
    android:height="60dp"
    android:width="270dp" />

<stroke
    android:width="1dp"
    android:color="#878787" />

password_shape:

<corners
    android:bottomLeftRadius="0dp"
    android:bottomRightRadius="0dp"
    android:topLeftRadius="10dp"
    android:topRightRadius="0dp" />

<solid android:color="#F2F2F2" />

<size
    android:height="60dp"
    android:width="270dp" />

<stroke
    android:width="1dp"
    android:color="#878787" />

facebook_shape:

<corners
    android:bottomLeftRadius="50dp"
    android:bottomRightRadius="50dp"
    android:topLeftRadius="50dp"
    android:topRightRadius="50dp" />

<solid android:color="#3F45F2" />

<size
    android:height="60dp"
    android:width="270dp" />

go_shape:

<corners
    android:bottomLeftRadius="0dp"
    android:bottomRightRadius="10dp"
    android:topLeftRadius="0dp"
    android:topRightRadius="0dp" />

<solid android:color="#F2272D" />

<size
    android:height="60dp"
    android:width="270dp" />

create all *_shape.xml in drawable folder in res

for remember me you can create two image and change that

and result is

I hope this can help you

分享给朋友:
您可能感兴趣的文章:
随机阅读: