如何制作带有阴影的圆角边框

huangapple go评论76阅读模式
英文:

How to make rounded border with shadow

问题

如何在屏幕底部创建这样的视图?我可以创建一个具有圆角边框的视图,但绿色阴影怎么做?

如何制作带有阴影的圆角边框

英文:

How can i make a view like this at bottom of screen ? I can make a view with round border but what about the green shadow ?

如何制作带有阴影的圆角边框

答案1

得分: 2

你可以使用Carbon来获得带有颜色阴影的效果。

GitHub链接:https://github.com/ZieIony/Carbon

将以下行添加到依赖项中:

api 'tk.zielony:carbon:0.16.0.1'

在 build.gradle 中添加语言兼容性选项:

android {
    ...

    compileOptions {
        sourceCompatibility JavaVersion.VERSION_1_8
        targetCompatibility JavaVersion.VERSION_1_8
    }
}

在 build.gradle 中添加数据绑定支持:

android {
    ...

    dataBinding {
        enabled = true
    }
}

要使用ProGuard与Carbon,请将以下规则添加到ProGuard配置中:

-dontwarn carbon.BR
-dontwarn carbon.internal**
-dontwarn java.lang.invoke**

-dontwarn android.databinding.**
-keep class android.databinding.** { *; }

你可以在Carbon的 GitHub 中找到以下图片和代码:

如何制作带有阴影的圆角边框

代码示例:

<carbon.widget.LinearLayout
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:orientation="horizontal">

    <carbon.widget.Button
        android:layout_width="56dp"
        android:layout_height="56dp"
        android:layout_margin="@dimen/carbon_padding"
        android:background="#ffffff"
        app:carbon_cornerRadius="2dp"
        app:carbon_elevation="8dp"
        app:carbon_elevationShadowColor="@color/carbon_red_700"/>

</carbon.widget.LinearLayout>

CardView 示例:

<carbon.widget.LinearLayout
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:orientation="horizontal">

    <carbon.widget.LinearLayout
        android:layout_width="match_parent"
        android:layout_height="160dp"
        android:layout_margin="@dimen/carbon_margin"
        android:background="#ffffff"
        app:carbon_cornerRadius="2dp"
        app:carbon_elevation="8dp"
        app:carbon_elevationShadowColor="@color/carbon_red_700">

        <carbon.widget.ImageView
            android:layout_width="match_parent"
            android:layout_height="0dp"
            android:layout_weight="1"
            android:src="@drawable/test_image"/>

        <carbon.widget.TextView
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:text="test text"/>
    </carbon.widget.LinearLayout>

</carbon.widget.LinearLayout>
英文:

you can get colored shadow using carbon

https://github.com/ZieIony/Carbon

add the following line to dependencies:

 api &#39;tk.zielony:carbon:0.16.0.1&#39;

add language compatibility options to build.gradle:

android {
...

compileOptions {
    sourceCompatibility JavaVersion.VERSION_1_8
    targetCompatibility JavaVersion.VERSION_1_8
    }
 }

add data binding support to build.gradle:

android {
...

dataBinding {
    enabled = true
   }
}

to use Carbon with ProGuard add the following rules to your ProGuard:

-dontwarn carbon.BR
-dontwarn carbon.internal**
-dontwarn java.lang.invoke**

-dontwarn android.databinding.**
-keep class android.databinding.** { *; }

you can find the following image and code in carbon's github:

如何制作带有阴影的圆角边框

code:

&lt;carbon.widget.LinearLayout
    android:layout_width=&quot;match_parent&quot;
    android:layout_height=&quot;wrap_content&quot;
    android:orientation=&quot;horizontal&quot;&gt;

&lt;carbon.widget.Button
    android:layout_width=&quot;56dp&quot;
    android:layout_height=&quot;56dp&quot;
    android:layout_margin=&quot;@dimen/carbon_padding&quot;
    android:background=&quot;#ffffff&quot;
    app:carbon_cornerRadius=&quot;2dp&quot;
    app:carbon_elevation=&quot;8dp&quot;
    app:carbon_elevationShadowColor=&quot;@color/carbon_red_700&quot;/&gt;

&lt;/carbon.widget.LinearLayout&gt;

cardview:

&lt;carbon.widget.LinearLayout
    android:layout_width=&quot;match_parent&quot;
    android:layout_height=&quot;wrap_content&quot;
    android:orientation=&quot;horizontal&quot;&gt;

&lt;carbon.widget.LinearLayout
    android:layout_width=&quot;match_parent&quot;
    android:layout_height=&quot;160dp&quot;
    android:layout_margin=&quot;@dimen/carbon_margin&quot;
    android:background=&quot;#ffffff&quot;
    app:carbon_cornerRadius=&quot;2dp&quot;
    app:carbon_elevation=&quot;8dp&quot;
    app:carbon_elevationShadowColor=&quot;@color/carbon_red_700&quot;&gt;

    &lt;carbon.widget.ImageView
        android:layout_width=&quot;match_parent&quot;
        android:layout_height=&quot;0dp&quot;
        android:layout_weight=&quot;1&quot;
        android:src=&quot;@drawable/test_image&quot;/&gt;

    &lt;carbon.widget.TextView
        android:layout_width=&quot;match_parent&quot;
        android:layout_height=&quot;wrap_content&quot;
        android:text=&quot;test text&quot;/&gt;
    &lt;/carbon.widget.LinearLayout&gt;

&lt;/carbon.widget.LinearLayout&gt;

huangapple
  • 本文由 发表于 2020年9月22日 01:25:54
  • 转载请务必保留本文链接:https://go.coder-hub.com/63997204.html
匿名

发表评论

匿名网友

:?: :razz: :sad: :evil: :!: :smile: :oops: :grin: :eek: :shock: :???: :cool: :lol: :mad: :twisted: :roll: :wink: :idea: :arrow: :neutral: :cry: :mrgreen:

确定