AI 助理
备案控制台
开发者社区 开发与运维 文章 正文

Android布局实现圆角边框

2012-07-23 1443
版权
版权声明：
本文内容由阿里云实名注册用户自发贡献，版权归原作者所有，阿里云开发者社区不拥有其著作权，亦不承担相应法律责任。具体规则请查看《 阿里云开发者社区用户服务协议》和 《阿里云开发者社区知识产权保护指引》。如果您发现本社区中有涉嫌抄袭的内容，填写 侵权投诉表单进行举报，一经查实，本社区将立刻删除涉嫌侵权内容。
简介：

这里用的是TableLayout布局的。先看效果图

下面看下布局文件

[html]  view plain copy
  1. <?xml version="1.0" encoding="utf-8"?>  
  2. <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"  
  3.     android:layout_width="fill_parent"  
  4.     android:layout_height="fill_parent"  
  5.     android:background="#FFFFFF"  
  6.     android:orientation="vertical" >  
  7.    
  8.     <!-- 表格布局 -->  
  9.     <TableLayout  
  10.         android:layout_width="fill_parent"  
  11.         android:layout_height="wrap_content"  
  12.         android:padding="10dip" >  
  13.         <!-- 表格布局：第一行 -->  
  14.         <TableRow  
  15.             android:layout_width="fill_parent"  
  16.             android:layout_height="wrap_content"  
  17.             android:background="@drawable/shape_top_corner_no_bottom_line"  
  18.             android:padding="10dip" >  
  19.             <TextView  
  20.                 android:layout_width="wrap_content"  
  21.                 android:layout_height="wrap_content"  
  22.                 android:layout_gravity="center_vertical"  
  23.                 android:layout_marginRight="10dip"  
  24.                 android:text="姓名:" >  
  25.             </TextView>  
  26.             <EditText  
  27.                 android:id="@+id/bankingYourNameEditText"  
  28.                 android:layout_width="wrap_content"  
  29.                 android:layout_height="wrap_content"  
  30.                 android:layout_gravity="center_vertical"  
  31.                 android:layout_weight="1"  
  32.                 android:background="@null"  
  33.                 android:singleLine="true" >  
  34.             </EditText>  
  35.         </TableRow>  
  36.         <!-- 表格布局：第二行 -->  
  37.         <TableRow  
  38.             android:layout_width="fill_parent"  
  39.             android:layout_height="wrap_content"  
  40.             android:background="@drawable/shape_no_corner_without_bottom"  
  41.             android:padding="10dip" >  
  42.             <TextView  
  43.                 android:layout_width="wrap_content"  
  44.                 android:layout_height="wrap_content"  
  45.                 android:layout_gravity="center_vertical"  
  46.                 android:layout_marginRight="10dip"  
  47.                 android:text="联系电话:" >  
  48.             </TextView>  
  49.             <EditText  
  50.                 android:id="@+id/bankingContactTelEditText"  
  51.                 android:layout_width="wrap_content"  
  52.                 android:layout_height="wrap_content"  
  53.                 android:layout_gravity="center_vertical"  
  54.                 android:layout_weight="1"  
  55.                 android:background="@null"  
  56.                 android:inputType="phone"  
  57.                 android:singleLine="true" >  
  58.             </EditText>  
  59.         </TableRow>  
  60.         <!-- 表格布局：第三行 -->  
  61.         <TableRow  
  62.             android:layout_width="fill_parent"  
  63.             android:layout_height="wrap_content"  
  64.             android:background="@drawable/shape_bottom_corner_no_top_line"  
  65.             android:padding="10dip" >  
  66.             <TextView  
  67.                 android:layout_width="wrap_content"  
  68.                 android:layout_height="wrap_content"  
  69.                 android:layout_gravity="center_vertical"  
  70.                 android:layout_marginRight="10dip"  
  71.                 android:text="联系电话:" >  
  72.             </TextView>  
  73.             <EditText  
  74.                 android:id="@+id/bankingContactTelEditText"  
  75.                 android:layout_width="wrap_content"  
  76.                 android:layout_height="wrap_content"  
  77.                 android:layout_gravity="center_vertical"  
  78.                 android:layout_weight="1"  
  79.                 android:background="@null"  
  80.                 android:inputType="phone"  
  81.                 android:singleLine="true" >  
  82.             </EditText>  
  83.         </TableRow>  
  84.     </TableLayout>  
  85.    
  86.     <Button  
  87.         android:id="@+id/button1"  
  88.         android:layout_width="wrap_content"  
  89.         android:layout_height="wrap_content"  
  90.         android:layout_gravity="center"  
  91.         android:text="Button" />  
  92.    
  93. </LinearLayout>  

表格布局中每个TableRow表示一行，TableRow中的每个基本控件都是一列，这是一个三行两列的布局

这里的表格背景是自定义的shape，下面分别看一下三个shape的代码。

shape_top_corner_no_bottom_line.xml文件：顶部带圆角 白色背景 灰色边框 无下边框 长方体

[html]  view plain copy
  1. <?xml version="1.0" encoding="UTF-8"?>  
  2. <!-- 顶部带圆角 白色背景 灰色边框 无下边框 长方体 -->  
  3. <layer-list xmlns:android="http://schemas.android.com/apk/res/android">  
  4.     <item>  
  5.         <shape>  
  6.             <solid android:color="#FFFFFF" />  
  7.             <corners android:topLeftRadius="10dp" android:topRightRadius="10dp"  
  8.                 android:bottomRightRadius="0.1dp" android:bottomLeftRadius="0.1dp" />  
  9.             <stroke android:width="1dp" android:color="#ffa8abad" />  
  10.         </shape>  
  11.     </item>  
  12.     <item android:top="1dp" android:left="1dp" android:right="1dp">  
  13.         <shape>  
  14.             <solid android:color="#FFFFFF" />  
  15.             <corners android:topLeftRadius="10dp" android:topRightRadius="10dp"  
  16.                 android:bottomRightRadius="0.1dp" android:bottomLeftRadius="0.1dp" />  
  17.             <stroke android:width="1dp" android:color="#ffffffff" />  
  18.         </shape>  
  19.     </item>  
  20. </layer-list>  

shape_no_corner_without_bottom.xml文件：不带圆角 白色背景 灰色边框 无下边框 长方体
[html]  view plain copy
  1. <?xml version="1.0" encoding="UTF-8"?>  
  2. <!-- 不带圆角 白色背景 灰色边框 无下边框 长方体 -->  
  3. <layer-list xmlns:android="http://schemas.android.com/apk/res/android" >  
  4.     <item>  
  5.         <shape>  
  6.             <solid android:color="#FFFFFF" />  
  7.             <stroke  
  8.                 android:width="1dp"  
  9.                 android:color="#ffa8abad" />  
  10.         </shape>  
  11.     </item>  
  12.     <item  
  13.         android:left="1dp"  
  14.         android:right="1dp"  
  15.         android:top="1dp">  
  16.         <shape>  
  17.             <solid android:color="#FFFFFF" />  
  18.             <stroke  
  19.                 android:width="1dp"  
  20.                 android:color="#ffffffff" />  
  21.         </shape>  
  22.     </item>  
  23. </layer-list>  

shape_bottom_corner_no_top_line.xml文件：底部圆角 白色背景 灰色边框 长方体
[html]  view plain copy
  1. <?xml version="1.0" encoding="UTF-8"?>  
  2. <!-- 底部圆角 白色背景 灰色边框 长方体 -->  
  3. <layer-list xmlns:android="http://schemas.android.com/apk/res/android">  
  4.     <item>  
  5.         <shape>  
  6.             <solid android:color="#FFFFFF" />  
  7.             <corners android:topLeftRadius="0.1dp" android:topRightRadius="0.1dp"  
  8.                 android:bottomRightRadius="10dp" android:bottomLeftRadius="10dp" />  
  9.             <stroke android:width="1dp" android:color="#ffa8abad" />  
  10.         </shape>  
  11.     </item>  
  12.     <item android:top="1dp" android:bottom="1dp" android:left="1dp" android:right="1dp">  
  13.         <shape>  
  14.             <solid android:color="#FFFFFF" />  
  15.             <corners android:topLeftRadius="0.1dp" android:topRightRadius="0.1dp"  
  16.                 android:bottomRightRadius="10dp" android:bottomLeftRadius="10dp" />  
  17.             <stroke android:width="1dp" android:color="#ffffffff" />  
  18.         </shape>  
  19.     </item>  
  20. </layer-list>  
文章标签：
Android开发
关键词：
Android布局
Android圆角
Android实现
Android边框
一叶飘舟
目录
相关文章
艾尼麻麻
|
7月前
|
XML Android开发 数据安全/隐私保护
10. 【Android教程】网格布局 GridLayout
10. 【Android教程】网格布局 GridLayout
艾尼麻麻
343 1
游客syv66y3m2ksnc
|
3月前
|
ARouter Android开发
Android不同module布局文件重名被覆盖
Android不同module布局文件重名被覆盖
游客syv66y3m2ksnc
172 0
君子世无双~
|
5月前
|
移动开发 监控 前端开发
构建高效Android应用：从优化布局到提升性能
【7月更文挑战第60天】在移动开发领域，一个流畅且响应迅速的应用程序是用户留存的关键。针对Android平台，开发者面临的挑战包括多样化的设备兼容性和性能优化。本文将深入探讨如何通过改进布局设计、内存管理和多线程处理来构建高效的Android应用。我们将剖析布局优化的细节，并讨论最新的Android性能提升策略，以帮助开发者创建更快速、更流畅的用户体验。
君子世无双~
82 10
艾尼麻麻
|
7月前
|
Android开发
08. 【Android教程】相对布局 RelativeLayout
08. 【Android教程】相对布局 RelativeLayout
艾尼麻麻
104 0
stefanie燕
|
3月前
|
ARouter Android开发
Android不同module布局文件重名被覆盖
Android不同module布局文件重名被覆盖
stefanie燕
225 0
阿迷创客
|
5月前
|
编解码 Android开发
【Android Studio】使用UI工具绘制，ConstraintLayout 限制性布局，快速上手
本文介绍了Android Studio中使用ConstraintLayout布局的方法，通过创建布局文件、设置控件约束等步骤，快速上手UI设计，并提供了一个TV Launcher界面布局的绘制示例。
阿迷创客
91 1
蓝色流星1000
|
6月前
|
Android开发 Kotlin
kotlin开发安卓app，如何让布局自适应系统传统导航和全面屏导航
使用`navigationBarsPadding()`修饰符实现界面自适应，自动处理底部导航栏的内边距，再加上`.padding(bottom = 10.dp)`设定内容与屏幕底部的距离，以完成全面的布局适配。示例代码采用Kotlin。
蓝色流星1000
161 15
Ant.Dream
|
5月前
|
XML 数据可视化 API
Android经典实战之约束布局ConstraintLayout的实用技巧和经验
ConstraintLayout是Android中一款强大的布局管理器，它通过视图间的约束轻松创建复杂灵活的界面。相较于传统布局，它提供更高灵活性与性能。基本用法涉及XML定义约束，如视图与父布局对齐。此外，它支持百分比尺寸、偏移量控制等高级功能，并配有ConstraintSet和编辑器辅助设计。合理运用可显著提高布局效率及性能。
Ant.Dream
296 0
。思索
|
5月前
|
Android开发
AutoX——当Android中clickable属性显示为false,实际可点击的布局如何处理
AutoX——当Android中clickable属性显示为false,实际可点击的布局如何处理
。思索
79 0
Ant.Dream
|
5月前
|
XML 前端开发 Android开发
Android经典实战之Kotlin中实现圆角图片和圆形图片
本文介绍两种实现圆角图像视图的方法。第一种是通过自定义Kotlin `AppCompatImageView`，重写`onDraw`方法使用`Canvas`和`Path`进行圆角剪裁。第二种利用Android Material库中的`ShapeableImageView`，简单配置即可实现圆角效果。两种方法均易于实现且提供动态调整圆角半径的功能。
Ant.Dream
108 0

热门文章

最新文章

  • 1
    app开发之安卓Android+苹果ios打包所有权限对应解释列表【长期更新】-以及默认打包自动添加权限列表和简化后的基本打包权限列表以uniapp为例-优雅草央千澈
  • 2
    【03】优雅草央千澈详解关于APP签名以及分发-上架完整流程-第三篇安卓APP上架华为商店后面的步骤-华为应用商店相对比较麻烦一些-华为商店安卓上架
  • 3
    【04】flutter补打包流程的签名过程-APP安卓调试配置-结构化项目目录-完善注册相关页面-开发完整的社交APP-前端客户端开发+数据联调|以优雅草商业项目为例做开发-flutter开发-全流程
  • 4
    【02】写一个注册页面以及配置打包选项打包安卓apk测试—开发完整的社交APP-前端客户端开发+数据联调|以优雅草商业项目为例做开发-flutter开发-全流程-商业应用级实战开发-优雅草央千澈
  • 5
    如何修复 Android 和 Windows 不支持视频编解码器的问题？
  • 6
    [Android] 基于WLAN无线执行自动化方法
  • 7
    【移动开发】Android中将我们平时积累的工具类打包
  • 8
    [Android Pro] CPU占用计算方法
  • 9
    Android之TCP服务器编程
  • 10
    Android学习之Animation（三）
  • 1
    探索Android应用开发中的Kotlin语言
    90
  • 2
    探索安卓与iOS开发的差异：平台特性与用户体验的对比分析
    65
  • 3
    Android Kotlin中使用 LiveData、ViewModel快速实现MVVM模式
    231
  • 4
    Android 定时任务
    72
  • 5
    android 设置系统时间的流程
    502
  • 6
    Android经典面试题之Kotlin中object关键字实现的是什么类型的单例模式？原理是什么？怎么实现双重检验锁单例模式？
    80
  • 7
    探索iOS与安卓应用开发的核心差异及未来趋势
    47
  • 8
    探索安卓与iOS开发的差异：构建未来应用的关键考量
    70
  • 9
    Android经典面试题之Kotlin中Lambda表达式有哪些用法
    44
  • 10
    Android经典面试题之Kotlin中Lambda表达式和匿名函数的区别
    45

    • 相关课程

    更多
  • 开源Android容器化框架Atlas开发者指南

    • 相关电子书

    更多
  • 58同城Android客户端Walle框架演进与实践之路
  • Android组件化实现
  • 蚂蚁聚宝Android秒级编译——Freeline
    • 下一篇
    阿里云oss简介和如何对接使用