Android开发 ---xml布局元素

 


1、android:orientation="vertical/horizontal"
     vertical为垂直布局,

     horizontal为水平布局

2、android:layout_width="wrap_content",android:layout_height="wrap_content"

  描述:

    高亮部分的layout_width的值和layout_height的值都设置为wrap_content,那么这个布局将会和内容自适应,内容多大,布局就多大

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/activity_main"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:orientation="vertical">
    <TextView
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:text="内容1"
        />
    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="内容2"
        />
</LinearLayout>

效果:

  

3、android:layout_width="",android:layout_height=""

   描述:

    1部分:layout_width和layout_height的值都设置为match_parent,则它们会找到它们的父级元素,父级元素有多宽,它就会多宽,父级元素有多高,它就会多高。

    2部分:layout_width和layout_height的值都设置为wrap_content,则它们会与内容自适应,内容有多宽,布局就会有多宽,内容有多高,布局就会多高。

    3部分:layout_width的值设置为match_parent,则布局的宽会是父级元素的宽,layout_height的值设置为wrap_content,则布局的高是与内容自适应的。

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/activity_main"
    android:layout_width="match_parent"
    android:layout_height="match_parent"----------------1部分
    android:orientation="vertical">
    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"--------------2部分
        android:text="内容1"
        />
    <TextView
        android:layout_width="match_parent"
        android:layout_height="wrap_content"-----------------------3部分
        android:text="内容2"
        />
</LinearLayout>

效果图:

 

4、文本输入控件 ---EditText

 描述:

    EdiText控件是专门用来接收用户输入的信息的控件

    inputType用来设置该控件的类型, 值为textPassword是用来输入密码的,

    android:inputType="none"

    android:inputType="text"

    android:inputType="textCapCharacters"//前3个输入普通字符

    android:inputType="textCapWords"//单词首字母大写

    android:inputType="textCapSentences"//仅第一个字母大写
    android:inputType="textAutoCorrect"
    android:inputType="textAutoComplete"//前两个自动完成
    android:inputType="textMultiLine"//多行输入
    android:inputType="textImeMultiLine"//输入法多行(不一定支持)
    android:inputType="textNoSuggestions"//不提示
    android:inputType="textUri"//URI格式
    android:inputType="textEmailAddress"//电子邮件地址格式
    android:inputType="textEmailSubject"//邮件主题格式
    android:inputType="textShortMessage"//短消息格式
    android:inputType="textLongMessage"
    android:inputType="textPersonName"//人名格式
    android:inputType="textPostalAddress"//邮政格式
    android:inputType="textPassword"//密码格式
    android:inputType="textVisiblePassword"//密码可见格式
    android:inputType="textWebEditText"//作为网页表单的文本格式
    android:inputType="textFilter"//文本筛选格式
    android:inputType="textPhonetic"//拼音输入格式
    android:inputType="number"//数字格式
    android:inputType="numberSigned"//有符号数字格式
    android:inputType="numberDecimal"//可以带小数点的浮点格式
    android:inputType="phone"//拨号键盘
    android:inputType="datetime"
    android:inputType="date"//日期键盘
    android:inputType="time"//时间键盘
 
    hint用来显示文字提示信息
<EditText
        android:id="@+id/upwd"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_marginTop="5dp"
        android:inputType="textPassword"  --密码输入框
        android:hint="请输入密码"
        />

5、按钮控件 --Button
<Button  
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:textSize="30sp"
        android:onClick="toRegister" --给按钮设置单击事件
        android:text="用户注册"
        />

6、线性布局---LinearLayout

  描述:

    线性布局下,每个元素占一行,或一列,这取决于orientation的值是vertical还是horizontal

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/activity_main"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical">
    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="内容1"
        />
    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="内容2"
        />
</LinearLayout>

 效果图:

  描述:内容1占一行,内容2占一行

 

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/activity_main"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="horizontal">
    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="内容1"
        />
    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="内容2"
        />
</LinearLayout>

效果图:

  描述:内容1占一列,内容2占一列

  

 

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/activity_main"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="horizontal">
    <TextView
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:text="内容1"
        />
    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="内容2"
        />
</LinearLayout>

效果图:

  描述:只显示内容1,内容2不见了,原因就是第一个TextView中的layout_width的值设置为fill_parent造成的

 7、layout_weight ---按比例分布,值为数字

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/activity_main"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical">
    <TextView
        android:layout_width="wrap_content"
        android:layout_weight="1"
        android:layout_height="wrap_content"
        android:text="内容1"
        />
    <TextView
        android:layout_width="wrap_content"
        android:layout_weight="1"
        android:layout_height="wrap_content"
        android:text="内容2"
        />
</LinearLayout>

效果图:

 

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/activity_main"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="horizontal">
    <TextView
        android:layout_width="wrap_content"
        android:layout_weight="1"
        android:layout_height="wrap_content"
        android:text="内容1"
        />
    <TextView
        android:layout_width="wrap_content"
        android:layout_weight="1"
        android:layout_height="wrap_content"
        android:text="内容2"
        />
</LinearLayout>

效果图: 

  

8、RelativeLayout--相对布局

dimens.xml

<?xml version="1.0" encoding="utf-8"?>
<resources>
    <!-- Default screen margins, per the Android Design guidelines. -->
    <dimen name="activity_horizontal_margin">16dp</dimen>
    <dimen name="activity_vertical_margin">16dp</dimen>
</resources>

引用dimens.xml文件中的数据设置边距的值,符号@

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:id="@+id/activity_dialog"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:paddingBottom="@dimen/activity_vertical_margin" ---内边距
    android:paddingLeft="@dimen/activity_horizontal_margin" ---左内边距
    android:paddingRight="@dimen/activity_horizontal_margin" ---右内边距
    android:paddingTop="@dimen/activity_vertical_margin"  ---上内边距
    >
    <Button
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:textSize="30sp"
        android:text="用户登录"
        />
</RelativeLayout>

效果图:

  

9、RadioGroup ---单选按钮组

  描述:一组单选按钮中选取其中一个

  RadioButton --一个单选按钮

    checked ="true" 表示默认选中

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/activity_linear"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical">
    <RadioGroup
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:orientation="horizontal"
        android:checkedButton="0">
        <RadioButton
            android:id="@+id/usex1"
            android:checked="true"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="男"/>
        <RadioButton
            android:id="@+id/usex2"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="女"/>
    </RadioGroup>
    
</LinearLayout>

效果图:

 

10、CheckBox ---复选按钮

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/activity_linear"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical">    
    <CheckBox
        android:id="@+id/showPwd"
        android:text="显示密码"
        android:layout_width="match_parent"
        android:layout_height="wrap_content" />
</LinearLayout>

效果图:

11、maxLength ---设置文本框能输入的最大值

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/activity_linear"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical">
    <EditText
        android:id="@+id/uname"
        android:hint="请输入6-12位用户名"
        android:maxLength="12"
        android:layout_width="match_parent"
        android:layout_height="wrap_content" />
</LinearLayout>

效果图:

12、minLines ---至少3行 maxLines---最大三行

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/activity_linear"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical">
    <EditText
        android:id="@+id/uname"
        android:hint="请输入6-12位用户名"
        android:minLines="3"
        android:maxLength="12"
        android:layout_width="match_parent"
        android:layout_height="wrap_content" />
</LinearLayout>

效果图:

  

13、在相对布局下:

  layout_alignBaseline = "@id/*" ---新元件与特定元件的基准线对齐

  layout_toRightOf="@id/*" ---新元素与特定元素的右基准线对齐

  layout_below="@id/*" ---新元素位于特定元素的下方

  layout_alignBottom="@id/*" ---新元素与特定元素的底部基准线对齐

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/activity_relative"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:padding="3dp">

    <TextView
        android:id="@+id/title"
        android:text="添加学生"
        android:textSize="30sp"
        android:gravity="center"
        android:layout_width="match_parent"
        android:layout_height="wrap_content" />

    <TextView
        android:id="@+id/lblsname"
        android:text="姓名:"
        android:layout_below="@id/title"
        android:textSize="25sp"
        android:layout_marginTop="5dp"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content" />

    <EditText
        android:id="@+id/sname"
        android:hint="请输入姓名"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_alignBaseline="@id/lblsname"
        android:layout_toRightOf="@id/lblsname" /> 
</RelativeLayout>

效果图:

14、表格布局  

  详细属性请看博客:

     Android开发 -- 界面布局:边距、线性布局、表格布局、相对布局、框架(层叠)布局、绝对布局

<?xml version="1.0" encoding="utf-8"?>
<TableLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/activity_table"
    android:layout_width="match_parent"
    android:stretchColumns="0,1,2,3"
    android:collapseColumns="0"
    android:shrinkColumns="3"
    android:layout_height="match_parent">

    <TableRow>
        <TextView android:text="编号" android:gravity="center" android:textStyle="bold" android:textSize="25sp"/>
        <TextView android:text="姓名" android:gravity="center" android:textStyle="bold" android:textSize="25sp"/>
        <TextView android:text="年龄" android:gravity="center" android:textStyle="bold" android:textSize="25sp"/>
        <TextView android:text="地址" android:gravity="center" android:textStyle="bold" android:textSize="25sp"/>
    </TableRow>
    <TableRow>
        <TextView android:text="1" android:gravity="center"  android:textSize="25sp"/>
        <TextView android:text="Jack" android:gravity="center"  android:textSize="25sp"/>
        <TextView android:text="20" android:gravity="center"  android:textSize="25sp"/>
        <TextView android:text="南方IT学院教学楼" android:gravity="center"  android:textSize="25sp"/>
    </TableRow>
    <TableRow>
        <TextView android:text="2" android:gravity="center"  android:textSize="25sp"/>
        <TextView android:text="Lucy" android:gravity="center"  android:textSize="25sp"/>
        <TextView android:text="22" android:gravity="center" android:textSize="25sp"/>
        <TextView android:text="南方IT学院教学楼" android:gravity="center" android:textSize="25sp"/>
    </TableRow>
    <TableRow>
        <TextView android:text="3" android:gravity="center"  android:textSize="25sp"/>
        <TextView android:text="Toms" android:gravity="center"  android:textSize="25sp"/>
        <TextView android:text="23" android:gravity="center"  android:textSize="25sp"/>
        <TextView android:text="南方IT学院教学楼" android:gravity="center"  android:textSize="25sp"/>
    </TableRow>
    <TableRow>
        <TextView android:text="4" android:gravity="center"  android:textSize="25sp"/>
        <TextView android:text="Marry" android:gravity="center"  android:textSize="25sp"/>
        <TextView android:text="20" android:gravity="center"  android:textSize="25sp"/>
        <TextView android:text="南方IT学院教学楼" android:gravity="center"  android:textSize="25sp"/>
    </TableRow>
    <TableRow>
        <Button
            android:layout_width="150dp"
            android:layout_height="wrap_content"
            android:text="点击返回"
            android:layout_column="2"
            android:layout_span="2"
            android:onClick="doBack"
            />
    </TableRow>
</TableLayout>

 15、FrameLayout ---层叠布局 

<?xml version="1.0" encoding="utf-8"?>
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/activity_frame"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    >

    <LinearLayout
        android:id="@+id/one"
        android:orientation="vertical"
        android:background="@android:color/holo_blue_light"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
    />
    <LinearLayout
        android:id="@+id/two"
        android:orientation="vertical"
        android:background="@android:color/holo_red_light"
        android:layout_width="match_parent"
        android:layout_height="400dp"/>
    <LinearLayout
        android:id="@+id/three"
        android:orientation="vertical"
        android:background="@android:color/holo_orange_light"
        android:layout_width="match_parent"
        android:layout_height="300dp"/>
</FrameLayout>

效果图:

 

ImageView --图像控件
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/activity_frame2"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="horizontal">

    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="用户名:"
        android:textSize="25dp"
        />
    <FrameLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content">
        <EditText
            android:id="@+id/upwd"
            android:inputType="textPassword"
            android:maxLength="12"
            android:layout_width="match_parent"
            android:layout_height="wrap_content" />
        <ImageView
            android:layout_gravity="right"
            android:layout_width="30dp"
            android:layout_height="30dp"
            android:src="@mipmap/ic_launcher"
            android:onClick="showPwd"
            />
    </FrameLayout>
</LinearLayout>

效果图:

 

 16、GridLayout ---网格布局

<?xml version="1.0" encoding="utf-8"?>
<GridLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/activity_grid"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:rowCount="6"
    android:columnCount="4">

    <EditText
        android:id="@+id/showNumber"
        android:layout_columnSpan="4"
        android:layout_width="251dp"
        android:gravity="right"
        android:inputType="none"
        />
    <Button
        android:id="@+id/b1"
        android:text="%"
        />
    <Button
        android:id="@+id/b2"
        android:text="√"
        />
    <Button
        android:id="@+id/b3"
        android:text="x²"
        />
    <Button
        android:id="@+id/b4"
        android:text="1/x"
        />
    <Button
        android:id="@+id/b5"
        android:text="CE"
        />
    <Button
        android:id="@+id/b6"
        android:text="C"
        />
    <Button
        android:id="@+id/b7"
        android:text="x"
        />
    <Button
        android:id="@+id/b8"
        android:text="÷"
        />
    <Button
        android:id="@+id/b9"
        android:text="7"
        />
    <Button
        android:id="@+id/b10"
        android:text="8"
        />
    <Button
        android:id="@+id/b11"
        android:text="9"
        />
    <Button
        android:id="@+id/b12"
        android:text="X"
        />
    <Button
        android:id="@+id/b13"
        android:text="4"
        />
    <Button
        android:id="@+id/b14"
        android:text="5"
        />
    <Button
        android:id="@+id/b15"
        android:text="6"
        />
    <Button
        android:id="@+id/b16"
        android:text="-"
        />
    <Button
        android:id="@+id/b17"
        android:text="1"
        />
    <Button
        android:id="@+id/b18"
        android:text="2"
        />
    <Button
        android:id="@+id/b19"
        android:text="3"
        />
    <Button
        android:id="@+id/b20"
        android:text="+"
        android:layout_rowSpan="2" //该按钮占两行
        android:layout_gravity="fill_vertical" //相对于父元素垂直布局
        />
    <Button
        android:id="@+id/b21"
        android:layout_columnSpan="2" //该按钮占两列
        android:layout_gravity="fill_horizontal" //相对于父元素水平布局
        android:text="0"
        />
    <Button
        android:id="@+id/b22"
        android:text="="
        />
</GridLayout>

效果图:

 

17、开关按钮

<ToggleButton
        android:checked="true"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content" />

效果图

  

18、进度条

<SeekBar
        android:id="@+id/seekBar"
        android:max="60"
        android:progress="0"
        android:layout_width="match_parent"
        android:layout_height="wrap_content" />

效果图:

 

19、平分条

<RatingBar
        android:id="@+id/ratingBar"
        android:max="5"
        android:progress="0"
        android:stepSize="0.5"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content" />

效果图:

 

20、转圈式进度条

<ProgressBar
        android:id="@+id/pb1"
        android:max="100"
        android:layout_width="match_parent"
        android:layout_height="wrap_content" />

效果图:

<ProgressBar
        android:id="@+id/pb2"
        android:max="100"
        style="?android:progressBarStyleLarge"
        android:layout_width="match_parent"
        android:layout_height="wrap_content" />

效果图:

21、进度条

<ProgressBar
        android:id="@+id/pb3"
        android:max="100"
        android:progress="10"
        style="?android:progressBarStyleHorizontal"
        android:layout_width="match_parent"
        android:layout_height="wrap_content" />
    <LinearLayout
        android:layout_width="match_parent"
        android:orientation="horizontal"
        android:layout_height="wrap_content">
        <Button
            android:layout_width="match_parent"
            android:layout_weight="1"
            android:text="开始"
            android:onClick="doStart"
            android:layout_height="wrap_content" />
        <Button
            android:layout_width="match_parent"
            android:layout_weight="1"
            android:text="停止"
            android:onClick="doStop"
            android:layout_height="wrap_content" />
    </LinearLayout>

效果图:

 

 22、设置是否当文本为URL链接/email/电话号码/map时,文本显示为可点击的链接。可选值(none/web/email/phone/map/all)

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:id="@+id/activity_text_view"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical">

    <TextView
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:text="@string/police"
        android:textSize="30sp"
        android:gravity="center"
        android:autoLink="phone"
        />
    <TextView
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:text="http://192.168.0.168"
        android:textSize="30sp"
        android:gravity="center"
        android:autoLink="web"
        />
    <EditText
        android:layout_width="match_parent"
        android:layout_height="60dp"
        android:hint="请输入电话号码"
        android:maxLines="1"
        android:inputType="phone"
        />
    <EditText
        android:layout_width="match_parent"
        android:layout_height="60dp"
        android:hint="请输入姓名"
        android:maxLines="1"
        android:inputType="text"
        />
    <EditText
        android:layout_width="match_parent"
        android:layout_height="60dp"
        android:hint="请输密码"
        android:maxLines="1"
        android:inputType="textPassword"
        />
</LinearLayout>

 23、下拉列表

strings.xml

<resources>
    <array name="jobs">
        <item>法师</item>
        <item>坦克</item>
        <item>射手</item>
        <item>刺客</item>
    </array>
</resources>
<Spinner
     android:id="@+id/hjob"
     android:entries="@array/jobs"
     android:spinnerMode="dropdown"
     android:layout_width="match_parent"
     android:layout_height="wrap_content">
</Spinner>

24、实现动态匹配输入的内容

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/activity_auto_complete"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical">

    <AutoCompleteTextView
        android:id="@+id/autoText"
        android:completionHint="根据名称查找"
        android:completionThreshold="1"
        android:layout_width="match_parent"
        android:layout_height="wrap_content" />
</LinearLayout>
 

转载于:https://www.cnblogs.com/zn615/p/8134837.html

  • 0
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值