android– 如何创建一个完整的RoundLayout或RelativeLayout轮

概述我正在尝试创建一个完整的圆形布局,以便我将任何内容放在该布局中.该内容应该在圈内.怎么可能？我尝试了以下方式.但是形状并不是一直都是圆形的.有时根据空间变成椭圆形.如何保持布局循环,内容应该进入内部？<LinearLayoutandroid:id="@+id/zodiac_Layout"

我正在尝试创建一个完整的圆形布局,以便我将任何内容放在该布局中.该内容应该在圈内.怎么可能？我尝试了以下方式.但是形状并不是一直都是圆形的.有时根据空间变成椭圆形.如何保持布局循环,内容应该进入内部？

<linearLayout            androID:ID="@+ID/zodiac_Layout"            androID:layout_wIDth="100dp"            androID:layout_height="100dp"            androID:orIEntation="vertical"            androID:background="@drawable/circular_background">            <ImageVIEw                androID:ID="@+ID/zodiac_img"                androID:layout_wIDth="match_parent"                androID:layout_height="match_parent"                androID:layout_marginRight="2dp"                androID:adjustVIEwBounds="true"                androID:src="@drawable/sunrise" />            <TextVIEw                androID:ID="@+ID/zodiac_name"                androID:layout_wIDth="wrap_content"                androID:layout_height="wrap_content"                androID:layout_gravity="center"                androID:layout_marginleft="5dp"                androID:text="@string/na"                androID:textcolor="#fff"                androID:textSize="@dimen/nakshatra_text_size" />        </linearLayout>

这是circular_background.xml

<?xml version="1.0" enCoding="utf-8"?><shape xmlns:androID="http://schemas.androID.com/apk/res/androID"    androID:shape="oval">    <solID androID:color="#50514F"/>    <size androID:wIDth="5dp"        androID:height="5dp"/></shape>

如果我将ImageVIEw设为match_parent,该怎么办？它来自布局的圆形形状.我希望沿着布局的圆形形状裁剪内容.

解决方法:

由于我们在评论中聊了什么.现在我知道你真正想要的是你的ImageVIEw和TextVIEw的循环裁剪.因此,经过专门的工作,我决定形成一个解决方案,该解决方案将产生如下图所示的输出：

.不要担心textVIEw,你可以将它放在任何地方.即使在图像的顶部！并改变它的大小！首先,您必须知道没有默认实现,这意味着没有默认的VIEw类在androID中提供循环裁剪视图.所以这里是使用XML解决这个技巧的两种选择！
第一替代(最佳选择)
我们将使用FrameLayout,这是一种将VIEws添加到彼此之上的布局.这意味着如果你放第一个然后第二个将在第一个之上等.
要求

>要在圆形视图中很好地拟合图像,那么它应该是SQUARE(这是合乎逻辑的),因此我们需要设置宽度和高度相等的值.
>我们需要一个带有笔划的圆形形状(这个想法是把它放在计算好的视图尺寸之上！)

在drawable文件夹中创建一个名为circular_image_crop.xml的文件.并粘贴代码(不要担心以后会描述它！)不要忘记阅读其中的注释：

<?xml version="1.0" enCoding="utf-8"?> <shape xmlns:androID="http://schemas.androID.com/apk/res/androID"       androID:shape="oval">  <solID androID:color="#00ffffff"/>   <!--The above colour is completely transparent!-->  <stroke androID:wIDth="20dp" androID:color="#ec407a" />  <size androID:wIDth="140dp" androID:height="140dp"/></shape>

制作完可绘制文件后,我们必须制作FrameLayout(此框架布局不是任何视图的根视图,只需将其复制到您想要显示此布局的任何视图中)继续并粘贴下面的代码(我们稍后会解释) ！)再次阅读其中的评论：

<FrameLayout        androID:layout_wIDth="match_parent"        androID:layout_height="wrap_content"        androID:background="#ec407a">        <!-- This is our framelayout! Notice our background color is the same as the one in the stroke of our drawable. Also this is your image vIEw notice the it has wIDth and height similar (square) do use match parent or wrap content just define a square and vIEws will be position by adjust vIEw bounds true-->        <ImageVIEw            androID:ID="@+ID/image_vIEw_user_profile_image"            androID:layout_wIDth="100dp"            androID:layout_height="100dp"            androID:layout_gravity="center_horizontal"            androID:layout_margintop="20dp"            androID:adjustVIEwBounds="true"            androID:contentDescription="@string/your_image_description"            androID:src="@drawable/your_image" />        <!-- Ooh here we have another image! This is an image just for displaying our drawable and crop our image (how?? dont worry!) -->        <ImageVIEw            androID:layout_wIDth="140dp"            androID:layout_height="140dp"            androID:layout_gravity="center_horizontal"            androID:contentDescription="@string/also_your_image_description_if_any"            androID:src="@drawable/circular_image_crop" />        <!--This text vIEw we almost forget here it is!-->        <TextVIEw            androID:ID="@+ID/your_text_vIEw_ID"            androID:layout_wIDth="match_parent"            androID:layout_height="wrap_content"            androID:layout_gravity="bottom"            androID:layout_marginBottom="8dp"            androID:layout_margintop="125dp"            androID:gravity="center"            androID:text="John Nanai Noni"            androID:textcolor="#ffffff"            androID:textSize="16sp"            androID:textStyle="bold" />    </FrameLayout>

它是如何工作和自定义的！???
好处是我们使用了Frame Layout并将真实视图定位在中心水平(方形图像).我们制作了可绘制的圆形,并在中心有一个圆孔(空间),与高度和图片相匹配.最后,我们添加我们的textvIEw并将其放在所有那些但位于底部(它不应该模糊图像对吗？).因此,我们可以理解这一点的方式是查看下面的图像作为所需的概要.(不要认为它复杂)：

从那里我们可以看到它如何在圆形作物中间的图像和etc

下一阶段：

从那里我们可以将相同的背景颜色应用到我们的整个布局(FrameLayout)来隐藏圆形的东西并留下我们自己的可见空间.00004是的,我们已经完成了我们的布局！怎么样的定制.
定制
对于颜色,您可以将自己的颜色放在FrameLayout背景中的任何位置以及可绘制的笔触.但永远不要改变< solID>它总是应该是完全透明的颜色.对于圆形裁剪半径的定制,我们可以挖掘它的数学公式,找出图像的覆盖范围！数学

Let your wIDth or height(the image is square remember) of your image be x dps. Then the values in your drawable are

stroke= 0.2071 * x

size(height and wIDth)=stroke + x

You can 2 or 3 dps for elimination of truncation errors!

实际上背后的数学基于下面的公式.如果您感兴趣的话如下评论,该公式有效：

第二替代方案
我认为对于不关心圆形视图之间空间的人来说另一种选择是通过在CardVIEw中创建ImageVIEw并使角半径变为CardVIEw大小的一半,例如这段代码：

<?xml version="1.0" enCoding="utf-8"?><androID.support.v7.Widget.CardVIEw       xmlns:androID="http://schemas.androID.com/apk/res/androID"      xmlns:app="http://schemas.androID.com/apk/res-auto"    androID:layout_wIDth="280dp"    androID:layout_height="280dp"    androID:layout_gravity="center_horizontal"    androID:layout_margin="30dp"    app:cardCornerRadius="140dp"    app:cardElevation="12dp">    <ImageVIEw        androID:layout_wIDth="200dp"        androID:layout_height="200dp"        androID:layout_gravity="center"        androID:adjustVIEwBounds="true"        androID:src="@drawable/login_back_ground" /> </androID.support.v7.Widget.CardVIEw>

这是我在AndroID Studio中获得的输出.此外,我不能保证这在各种设备中看起来如何,特别是旧设备！

结论这两种方法都很好,也很有用.理解它们甚至可以导致更多的自定义,例如使用第二个替代方案来实现自定义,例如添加圆形图像的高程.但第一种方法适合日常使用的数量,它也为所有AndroID设备带来了相同的体验.我希望这甚至可以帮助可能遇到同样问题的未来用户.

总结

以上是内存溢出为你收集整理的android – 如何创建一个完整的RoundLayout或RelativeLayout轮全部内容，希望文章能够帮你解决android – 如何创建一个完整的RoundLayout或RelativeLayout轮所遇到的程序开发问题。

如果觉得内存溢出网站内容还不错，欢迎将内存溢出网站推荐给程序员好友。