1. 全栈程序员必看首页

Android布局详解：FrameLayout[通俗易懂]

全栈程序员-站长 • • 未分类 • 阅读 80

Android布局详解：FrameLayout[通俗易懂]后来也一直没有再回头看，再后来，看到评论多是负面的，也就心懒了，这个系列就没再写下去了。今天重新把文章修改一下。完全没有错不敢说，只是把当年漏写的一些内容再补进去吧。评论不删不改，大家自己看吧。我写的文章，基本都是面向新手的，所以没有很多高深的玩法（我自己也不擅长啦，我也不是高手）。所以新手看我的文章，入门即可，高深的内容不在我这里，我的庙小，装不下大神。再版修正说明：首先

大家好，又见面了，我是你们的朋友全栈君。

后来也一直没有再回头看，再后来，看到评论多是负面的，也就心懒了，这个系列就没再写下去了。

今天重新把文章修改一下。完全没有错不敢说，只是把当年漏写的一些内容再补进去吧。

评论不删不改，大家自己看吧。

我写的文章，基本都是面向新手的，所以没有很多高深的玩法（我自己也不擅长啦，我也不是高手）。

所以新手看我的文章，入门即可，高深的内容不在我这里，我的庙小，装不下大神。

再版修正说明：

首先要感谢指出我错误的朋友。前一篇修正说明，写的借口比较多，忘了道歉，态度不好，请多多包涵。

特别要感谢27楼、29楼的朋友。这篇文章的确写的不够严谨，碰到了问题就一笔带过，给读者们造成了不少误解，非常抱歉。

当然，直接回复sb的网友，我只能呵呵了。“我的庙小，装不下大神”这句话其实是送给这些朋友的。

这次重新修改了android:layout_width=”fill_parent”属性造成的android:layout_gravity失效的事情。

FrameLayout是最简单的布局了。所有放在布局里的控件，都按照层次堆叠在屏幕的左上角。后加进来的控件覆盖前面的控件。

在FrameLayout布局里，定义任何空间的位置相关的属性都毫无意义。控件自动的堆放在左上角，根本不听你的控制。

看以下的例子：

 

[html]
view plain
copy

print
?
在CODE上查看代码片
派生到我的代码片

  1. <?xml version=“1.0” encoding=“utf-8”?>  
  2. <FrameLayout xmlns:android=“http://schemas.android.com/apk/res/android”  
  3.     android:layout_width=“fill_parent”  
  4.     android:layout_height=“fill_parent”  
  5.     >  
  6. <TextView   
  7.     android:layout_width=“fill_parent”  
  8.     android:layout_height=“wrap_content”  
  9.     android:textSize=“50sp”  
  10.     android:textColor=“#000000”  
  11.     android:text=“第一层”/>  
  12. <TextView   
  13.     android:layout_width=“fill_parent”  
  14.     android:layout_height=“wrap_content”  
  15.     android:textSize=“40sp”  
  16.     android:textColor=“#ffff00”  
  17.     android:text=“第二层”/>  
  18. <TextView   
  19.     android:layout_width=“fill_parent”  
  20.     android:layout_height=“wrap_content”  
  21.     android:textSize=“30sp”  
  22.     android:textColor=“#ff00ff”  
  23.     android:text=“第三层”/>  
  24. <TextView   
  25.     android:layout_width=“fill_parent”  
  26.     android:layout_height=“wrap_content”  
  27.     android:textSize=“20sp”  
  28.     android:textColor=“#00ffff”  
  29.     android:text=“第四层”/>  
  30. </FrameLayout>  
Android布局详解：FrameLayout[通俗易懂] 
<?xml version="1.0" encoding="utf-8"?>
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    >
<TextView 
    android:layout_width="fill_parent"
    android:layout_height="wrap_content"
    android:textSize="50sp"
    android:textColor="#000000"
    android:text="第一层"/>
<TextView 
    android:layout_width="fill_parent"
    android:layout_height="wrap_content"
    android:textSize="40sp"
    android:textColor="#ffff00"
    android:text="第二层"/>
<TextView 
    android:layout_width="fill_parent"
    android:layout_height="wrap_content"
    android:textSize="30sp"
    android:textColor="#ff00ff"
    android:text="第三层"/>
<TextView 
    android:layout_width="fill_parent"
    android:layout_height="wrap_content"
    android:textSize="20sp"
    android:textColor="#00ffff"
    android:text="第四层"/>
</FrameLayout>

效果如下图：layoutpic001

 Android布局详解：FrameLayout[通俗易懂]Android布局详解：FrameLayout[通俗易懂]

变化1

我们现在来尝试改变一下他们的位置。把第一、二个文本框改成：

[html]
view plain
copy

print
?
在CODE上查看代码片
派生到我的代码片

  1. <TextView   
  2.     android:id=“@+id/tv1”  
  3.     android:layout_width=“fill_parent”  
  4.     android:layout_height=“wrap_content”  
  5.     android:textSize=“50sp”  
  6.     android:textColor=“#000000”  
  7.     android:text=“第一层”/>  
  8. <TextView   
  9.     android:layout_width=“fill_parent”  
  10.     android:layout_height=“wrap_content”  
  11.     android:textSize=“40sp”  
  12.     android:textColor=“#ffff00”  
  13.     android:layout_toRightOf=“@id/tv1”  
  14.     android:text=“第二层”/>  
Android布局详解：FrameLayout[通俗易懂] 
<TextView 
    android:id="@+id/tv1"
    android:layout_width="fill_parent"
    android:layout_height="wrap_content"
    android:textSize="50sp"
    android:textColor="#000000"
    android:text="第一层"/>
<TextView 
    android:layout_width="fill_parent"
    android:layout_height="wrap_content"
    android:textSize="40sp"
    android:textColor="#ffff00"
    android:layout_toRightOf="@id/tv1"
    android:text="第二层"/>





也就是说，让第二个文本框放在第一个文本框的右边。我们来看看效果。看到了没？还是一样的不变吧。


变化2


我们来尝试下android:gravity属性。把第三个文本框改成：


   [html]
    view plain
    copy 



   


   print
   ?
   在CODE上查看代码片
   派生到我的代码片  


    

  1. <TextView   
    2. 

  2.     android:id=“@+id/tv3”  
    3. 

  3.     android:layout_width=“fill_parent”  
    4. 

  4.     android:layout_height=“wrap_content”  
    5. 

  5.     android:textSize=“30dip”  
    6. 

  6.     android:textColor=“#ff00ff”  
    7. 

  7.     android:gravity=“right”  
    8. 

  8.     android:text=“第三层”/>  
    9. 




  Android布局详解：FrameLayout[通俗易懂]
 




<TextView 
    android:id="@+id/tv3"
    android:layout_width="fill_parent"
    android:layout_height="wrap_content"
    android:textSize="30dip"
    android:textColor="#ff00ff"
    android:gravity="right"
    android:text="第三层"/>




看看效果如何？天哪！竟然没有覆盖，而是错开了！！！


layoutpic002


Android布局详解：FrameLayout[通俗易懂] 


Android布局详解：FrameLayout[通俗易懂] 


首先呢，我们不要大惊小怪。这个现象并不说明FrameLayout失效了。


gravity属性，是控制控件内部文本的格式的。而我们看我们控件的宽的属性是什么？是“fill_parent”，也就是说，我们文本框的宽度就是屏幕的宽度。那么android:gravity=”right”文本靠右，而文本框本身还是左上堆叠在一起的。不信，我们再来改改：


   [html]
    view plain
    copy 



   


   print
   ?
   在CODE上查看代码片
   派生到我的代码片  


    

  1. <TextView   
    2. 

  2.     android:id=“@+id/tv3”  
    3. 

  3.     <strong>android:layout_width=“wrap_content”</strong>  
    4. 

  4.     android:layout_height=“wrap_content”  
    5. 

  5.     android:textSize=“30dip”  
    6. 

  6.     android:textColor=“#ff00ff”  
    7. 

  7.     android:gravity=“right”  
    8. 

  8. <pre name=“code” class=“html”>      
    9. 




  Android布局详解：FrameLayout[通俗易懂]
 




<TextView 
    android:id="@+id/tv3"
    <strong>android:layout_width="wrap_content"</strong>
    android:layout_height="wrap_content"
    android:textSize="30dip"
    android:textColor="#ff00ff"
    android:gravity="right"
<pre name="code" class="html">    


android:text=”第三层”/> 






我们让第三个文本框的宽度自适应，也就是保证显示全文字即可。这个时候看一下效果呢？是不是打回原形啦？哈哈哈。


变化2 +



  这是这篇文章被喷最多的地方。原来的总结里面，有这么一句话：

 FrameLayout根本无法控制他的子控件的位置




  这句话有错，子控件可以通过

 android

 :

 layout_gravity

 属性来控制自己在父控件中的位置。




 废话少说，上代码




  







    [html]

     view plain

     copy 



    


    print
    ?
    在CODE上查看代码片
    派生到我的代码片   


    

  1. <TextView   
    2. 

  2.     android:id=“@+id/tv3”  
    3. 

  3.     android:layout_width=”<span style=”font-family: Arial, Helvetica, sans-serif;”>fill_parent</span><span style=“font-family: Arial, Helvetica, sans-serif;”>“</span>  
    4. 

  4.     android:layout_height=“wrap_content”  
    5. 

  5.     android:textSize=“30dip”  
    6. 

  6.     android:textColor=“#ff00ff”  
    7. 

  7.     android:layout_gravity=“right”  
    8. 

  8.     android:text=“第三层”/>  
    9. 




   Android布局详解：FrameLayout[通俗易懂]
  




<TextView 
    android:id="@+id/tv3"
    android:layout_width="<span style="font-family: Arial, Helvetica, sans-serif;">fill_parent</span><span style="font-family: Arial, Helvetica, sans-serif;">"</span>
    android:layout_height="wrap_content"
    android:textSize="30dip"
    android:textColor="#ff00ff"
    android:layout_gravity="right"
    android:text="第三层"/>




效果和layoutpic001图一样。看上去貌似android:layout_gravity=”right”这句话没有起作用。其实是因为android:layout_width=”fill_parent”这个属性造成的。文本框的宽度是充满父控件，所以文字不会到右边去。


改成：


 







    [html]

     view plain

     copy 



    


    print
    ?
    在CODE上查看代码片
    派生到我的代码片   


    

  1. <TextView   
    2. 

  2.     android:id=“@+id/tv3”  
    3. 

  3.     android:layout_width=“wrap_content”  
    4. 

  4.     android:layout_height=“wrap_content”  
    5. 

  5.     android:textSize=“30dip”  
    6. 

  6.     android:textColor=“#ff00ff”  
    7. 

  7.     android:layout_gravity=“right”  
    8. 

  8.     android:text=“第三层”/>  
    9. 




   Android布局详解：FrameLayout[通俗易懂]
  




<TextView 
    android:id="@+id/tv3"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:textSize="30dip"
    android:textColor="#ff00ff"
    android:layout_gravity="right"
    android:text="第三层"/>




效果和layoutpic002图一样。android:layout_gravity=”right”这句话就起作用了。


变化3


有回帖说用：android:layout_gravity=”center_horizontal|bottom”


我们试了一下：









   [html]

    view plain

    copy 



   


   print
   ?
   在CODE上查看代码片
   派生到我的代码片  


    

  1. <TextView   
    2. 

  2.     android:layout_width=“fill_parent”  
    3. 

  3.     android:layout_height=“wrap_content”  
    4. 

  4.     android:textSize=“20sp”  
    5. 

  5.     android:textColor=“#00ffff”  
    6. 

  6.     android:layout_gravity=“center_horizontal|bottom”  
    7. 

  7.     android:text=“第四层”/>  
    8. 




  Android布局详解：FrameLayout[通俗易懂]
 




<TextView 
    android:layout_width="fill_parent"
    android:layout_height="wrap_content"
    android:textSize="20sp"
    android:textColor="#00ffff"
    android:layout_gravity="center_horizontal|bottom"
    android:text="第四层"/>


 


效果如何？如下图


layoutpic003



 Android布局详解：FrameLayout[通俗易懂]
 





Android布局详解：FrameLayout[通俗易懂] 


我用的华为手机，第四层没居中，但是跑到底下来了。也就是说 center_horizontal 没起作用。


这个错误也是因为android:layout_width=”fill_parent”造成的。改成：









   [html]

    view plain

    copy 



   


   print
   ?
   在CODE上查看代码片
   派生到我的代码片  


    

  1. <TextView   
    2. 

  2.     android:layout_width=“wrap_content”  
    3. 

  3.     android:layout_height=“wrap_content”  
    4. 

  4.     android:textSize=“20sp”  
    5. 

  5.     android:textColor=“#00ffff”  
    6. 

  6.     android:layout_gravity=“center_horizontal|bottom”  
    7. 

  7.     android:text=“第四层”/>  
    8. 




  Android布局详解：FrameLayout[通俗易懂]
 




<TextView 
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:textSize="20sp"
    android:textColor="#00ffff"
    android:layout_gravity="center_horizontal|bottom"
    android:text="第四层"/>


 第四层就居中了。 




Android布局详解：FrameLayout[通俗易懂] 


 


 


总结一下，经过以上的3个实验，我们知道FrameLayout里，默认所有的控件都是左上对齐。


控件可以通过android:layout_gravity属性控制自己在父控件中的位置。


 


是不是有人会问，这么简单的Layout有什么用？我想还是有它存在的价值的。


当你需要自己写一个View的时候，在View里面已经完成了你的逻辑(例如游戏^_^)，那么这个View只需要一个容器放置，就可以使用FrameLayout了。虽然用其他的布局也可以，但是用最简单的不是更省系统资源么。


                                                        
版权声明：本文内容由互联网用户自发贡献，该文观点仅代表作者本人。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容， 请联系我们举报，一经查实，本站将立刻删除。

发布者：全栈程序员-站长，转载请注明出处：https://javaforall.net/137065.html原文链接：https://javaforall.net
                        


                        

                        

                            
 赞 (0)

                                                    


                        

                            

                                                                    

                                                                                
                                            全栈程序员-站长的头像全栈程序员-站长                                        
                                    

                                                                

                                    

                                                                                     0                                         0                                                                            

                                    
                                    

                                        
                                    

                                

                            

                        

                    

                                                            



                                            

                            
相关推荐
  • 
        
    
        
            fileinput模块读取文件「建议收藏」        
            
    
        
    
                
    
            
                                 fileinput模块读取文件「建议收藏」            
        
    
        
    
            
    fileinput模块读取文件「建议收藏」fileinput模块可以对一个或多个文件中的内容进行迭代、遍历等操作。该模块的input()函数有点类似文件readlines()方法，区别在于前者是一个迭代对象，需要用for循环迭代，后者是一次性读取所有行。用fileinput对文件进行循环遍历，格式化输出，查找、替换等操作，非常方便。【典型用法】importfileinputforlineinfileinput.input…
    
        
    
        
    
                        
    
                                
                    全栈程序员-站长的头像                    全栈程序员-站长
                
            
    
                                    2022年5月5日
            
    
                26            
    
        
    
    
    

    • 

  • 
        
    
        
            list遍历的几种方式_arraylist cannot be cast to        
            
    
        
    
                
    
            
                                 list遍历的几种方式_arraylist cannot be cast to            
        
    
        
    
            
    list遍历的几种方式_arraylist cannot be cast to目录复原现场疑问原因解决方案注意点复原现场上代码：疑问为啥指定了类型还会出现类型转换出错？原因在pcp代码规范里面有提到里面的代码可以看到，一个指定类型，一个是泛型，他们居然可以互相转换，这是为了兼容以前版本在上面代码Set<String>set=newHashSet<>(list);……
    
        
    
        
    
                        
    
                                
                    全栈程序员-站长的头像                    全栈程序员-站长
                
            
    
                                    2022年9月8日
            
    
                0            
    
        
    
    
    

    • 

  • 
        
    
        
            mfc控件工具栏怎么打开_Qt界面库        
            
    
        
    
                
    
            
                                 mfc控件工具栏怎么打开_Qt界面库            
        
    
        
    
            
    mfc控件工具栏怎么打开_Qt界面库BCGControlBarProfessionalforMFC和BCGSuiteforMFCv33.0正式发布！此版本包括对每个显示器DPI感知的支持等，欢迎下载相关产品体验~
    
        
    
        
    
                        
    
                                
                    全栈程序员-站长的头像                    全栈程序员-站长
                
            
    
                                    2022年10月8日
            
    
                0            
    
        
    
    
    

    • 

  • 
        
    
        
            物联网的体系架构概述[通俗易懂]        
            
    
        
    
                
    
            
                                 物联网的体系架构概述[通俗易懂]            
        
    
        
    
            
    物联网的体系架构概述[通俗易懂]物联网物联网有别于互联网，互联网的主要目的是构建一个全球性的信息通信网络，而物联网则侧重信息服务，即利用互联网、无线通信等进行业务信息的传送，服务对象由人转变为包括人在内的所有物品。物联网作为互联网的延伸，通过将智能物件整合到数字世界，面向用户提供个性化和私有化服务。物联网的体系架构应包括如下内涵：网络体系架构、技术与标准体系、资源与标识体系、产业与应用体系、服务与安全体系。（图）USNUSN体系架构是由韩国电子与通信技术研究所在2007年瑞士日内网召开的ITU下一代网络全球标准化会议（NUN-U
    
        
    
        
    
                        
    
                                
                    全栈程序员-站长的头像                    全栈程序员-站长
                
            
    
                                    2022年9月15日
            
    
                0            
    
        
    
    
    

    • 

  • 
        
    
        
            Linux基础命令—resize2fs        
            
    
        
    
                
    
            
                                 Linux基础命令—resize2fs            
        
    
        
    
            
    resize2fs    调整ext2\ext3\ext4文件系统的大小，它可以放大或者缩小没有挂载的文件系统的大小。如果文件系统已经挂载，它可以扩大文件系统的大小，前提是内核支持在线调整大小。    size参数指定所请求的文件系统的新大小。如果没有指定任何单元，那么size参数的单位应该是文件系统的文件系统块大小。size参数可以由下列单位编号之一后缀：“s”、“K”、…
    
        
    
        
    
                        
    
                                
                    全栈程序员-站长的头像                    全栈程序员-站长
                
            
    
                                    2022年4月5日
            
    
                298            
    
        
    
    
    

    • 

  • 
        
    
        
            通俗易懂讲解均方误差 (MSE)「建议收藏」        
            
    
        
    
                
    
            
                                 通俗易懂讲解均方误差 (MSE)「建议收藏」            
        
    
        
    
            
    通俗易懂讲解均方误差 (MSE)「建议收藏」测量预测值与某些真实值匹配程度。MSE通常用作回归问题的损失函数。例如，根据其属性估算公寓的价格。这是维基百科中定义的均方误差(MSE)公式。它代表了一个非常简单的概念，但如果您刚开始使用ML，可能不太容易读懂。让我们从内而外拆开包装。MSE计算模型的预测Ŷ与真实标签Y的接近程度。您希望误差变为0。如果您预测房价，误差可能是预测价格与实际价格之间的差异。从标签中减去预测是行不通的。误差可能为负也可能为正，这是对样本求和时的问题。您可以取绝对值或误差的平方。取平方有一个特性，它惩罚更大的
    
        
    
        
    
                        
    
                                
                    全栈程序员-站长的头像                    全栈程序员-站长
                
            
    
                                    2022年9月30日
            
    
                0            
    
        
    
    
    

    • 

                        

                    


    	

		
发表回复
您的邮箱地址不会被公开。 必填项已用 * 标注






 


	

		

                

                    

            
    




            

                                                

                                                                                                            

                                        关注全栈程序员社区公众号