EasyClick 原生UI连载十一

EasyClick 原生UI教程

讲师：Mr-老鬼，QQ：1156346325
EasyClick 原生UI教程电梯直达：
EasyClick 原生UI教程总纲

EasyClick 原生UI 之测试主界面UI

效果图

前面几章都介绍了些基础知识，这篇介绍UI主界面设计

AndroidStudio 编辑效果

EasyCilck 项目稍加修改后代码展示：

<ScrollView xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
            xmlns:android="http://schemas.android.com/apk/res/android"
            xsi:noNamespaceSchemaLocation="layout.xsd"
            android:layout_height="match_parent"
            android:layout_width="match_parent">

    <LinearLayout android:layout_width="match_parent"
                  android:layout_height="match_parent"
                  android:orientation="vertical">

        <LinearLayout android:layout_width="match_parent"
                      android:layout_height="10dp"
                      android:background="#0072E3" >
            <View android:layout_width="match_parent"
                  android:layout_height="30dp"
                  android:background="#0072E3" />
        LinearLayout>

        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="80dp"
            android:background="#0072E3"
            android:gravity="center_vertical"
            android:orientation="horizontal"
            android:padding="20dp">

            <TextView
                android:layout_width="wrap_content"
                android:layout_height="match_parent"
                android:background="#0072E3"
                android:gravity="center"
                android:text="EC云测"
                android:textColor="#FFFFFF"
                android:textSize="26sp" />

            <TextView
                android:layout_width="0dp"
                android:layout_height="match_parent"
                android:layout_weight="1"
                android:background="#0072E3" />

            <TextView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:background="#0072E3"
                android:text="设置"
                android:textColor="#FFFFFF"
                android:textSize="18sp" />

        LinearLayout>

        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:orientation="vertical"
            android:padding="20dp">

            <TextView
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:text="EC云测工具说明:"
                android:textColor="#000000"
                android:textSize="16sp" />

            <TextView
                android:layout_width="match_parent"
                android:layout_height="100dp"
                android:text="我是说明，省略。。。。。。。"
                android:textSize="14sp" />
        LinearLayout>

        <TextView
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:padding="20dp"
            android:text="配置参数"
            android:textColor="#000000"
            android:textSize="16sp" />

        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:orientation="horizontal"
            android:padding="10dp">

            <CheckBox
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:text="配置一" />

            <CheckBox
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:text="配置二" />

            <CheckBox
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:text="配置三" />
        LinearLayout>

        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:orientation="horizontal"
            android:padding="10dp">

            <CheckBox
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:text="配置一" />

            <CheckBox
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:text="配置二" />

            <CheckBox
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:text="配置三" />
        LinearLayout>

        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:orientation="horizontal"
            android:padding="10dp">

            <CheckBox
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:text="配置四" />

            <CheckBox
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:text="配置五" />

            <CheckBox
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:text="配置六" />
        LinearLayout>

        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:orientation="horizontal"
            android:padding="10dp">

            <CheckBox
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:text="配置七" />

            <CheckBox
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:text="配置八" />

            <CheckBox
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:text="配置三九" />
        LinearLayout>

        <Button
            android:layout_width="match_parent"
            android:layout_height="60dp"
            android:background="#0072E3"
            android:text="运行测试"
            android:layout_margin="30dp"
            android:textColor="#FFFFFF"
            android:textSize="24sp" />
    LinearLayout>

ScrollView>

ui.js代码：

function main() {
     
    ui.layout("", "main.xml");
    // 下面是各种界面点击操作选择操作
    //略过。。。。。。
}
main();

我是Mr-老鬼、QQ1156346325 。交流QQ群：620028786,647082990
---------------------------------------版权声明------------------------------------------------------
版权所有~Mr-老鬼 ~转载请注明原文地址。
免责声明：本文所有的教程仅限交流学习使用不得用于违法用途，造成的法律后果本人不承担责任。