android中TABS的圆角

2022-01-09 00:00:00 xml tabs android java

我想为我在我的应用程序中构建的选项卡实现圆角.到目前为止，我能够想出这个

I want to achieve rounded corners for the tab that I've constructed in my application. So far I was able to come up with this

我希望我的圆角看起来像这样.(我的编码方式是只出现左右角，但是当状态改变时，它看起来像上图)

I would like my rounded corners to look as so. (I've coded it in such a way that only the right and left corners appear but when the states change it looks like the above image)

以下是我目前编写的代码.如何通过代码实现正确的圆角?

Below is the code that I've written so far. How can I achieve proper rounded corners through code ?

选定的 TAB.XML

SELECTED TAB.XML

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="rectangle"
>
<corners
    android:topRightRadius="10dp"
    android:bottomLeftRadius="10dp"/>

<gradient
    android:startColor="#000" 
    android:endColor="#000"
    android:gradientRadius="400"
    android:angle="-270"/>

</shape>

未选择的 TAB.XML

UNSELECTED TAB.XML

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="rectangle"
>
<gradient 
android:angle="90" 
android:startColor="#880f0f10" 
android:centerColor="#8858585a" 
android:endColor="#88a9a9a9"/>

 <corners
    android:topLeftRadius="10dp"
    android:bottomRightRadius="10dp"/>

</shape>

感谢您的回复！:)

推荐答案

我认为你应该使用 4 个形状:

I think you should use 4 shapes:

  • 左键未选中

  • for left button not selected

选择左键

右键未选择

选择右键

然后编写选择器用于 button 背景，请参见左侧按钮的示例(右侧类似):

And then write selector to use for button background, see example for the left button (for the right just the similar):

<selector
    xmlns:android="http://schemas.android.com/apk/res/android">

<item android:state_selected="true">
<shape android:shape="rectangle">
  <corners
    android:topLeftRadius="10dp"
    android:bottomLeftRadius="10dp"/>
  <gradient
    android:startColor="#000"
    android:endColor="#000"
    android:gradientRadius="400"
    android:angle="-270"/>
</shape>
</item>

<item>
    <shape android:shape="rectangle">
      <gradient
        android:angle="90"
        android:startColor="#880f0f10"
        android:centerColor="#8858585a"
        android:endColor="#88a9a9a9"/>
   <corners
      android:topLeftRadius="10dp"
      android:bottomLeftRadius="10dp"/>
</shape>
</item></selector>

相关文章