如何使用多个图像创建圆角视图

Question

如何创建可包含多个图像并包含圆形边框的视图？以下是最终产品外观的一些示例。

图像将从网址下载，如示例所示，视图中可能包含一到四个图像。

Answer 1

您可以使用几个好的第3部分库来创建圆形图像。但事先你会想要将多个图像组合成一个矩形，然后可以制成圆形。

我会查看CircleImageView或RoundedImageView。不同之处在于他们的名字描述CircleImageView将给你一个完美的圆形图像。 RoundedImageView实际上可以提供矩形，椭圆形或圆形的圆角。

如果您尝试保持应用轻量级并避免使用外部库，您还可以创建一个圆形图像，中间有一个透明圆圈，可以使用常规{覆盖在源图像顶部的背景图像{1}}。

Answer 2

另一种选择是创建一个自定义LinearLayout，其中包含xml中的四个ImageViews，并且可以动态重新组织使用权重显示的ImageViews个<?xml version="1.0" encoding="utf-8"?> <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="100dp" android:layout_height="100dp"> <LinearLayout android:id="@+id/left_container" android:layout_alignParentTop="true" android:layout_alignParentLeft="true" android:layout_width="50dp" android:layout_height="100dp" android:orientation="vertical"> <ImageView android:id="@+id/top_left_image" android:layout_width="50dp" android:layout_height="0dp" android:layout_weight="1" android:background="#111" /> <ImageView android:id="@+id/bottom_left_image" android:layout_width="50dp" android:layout_height="0dp" android:layout_weight="1" android:background="#333" /> </LinearLayout> <LinearLayout android:id="@+id/right_container" android:layout_width="50dp" android:layout_height="100dp" android:layout_toRightOf="@+id/left_container" android:orientation="vertical"> <ImageView android:id="@+id/top_right_image" android:layout_width="50dp" android:layout_height="0dp" android:layout_weight="1" android:background="#555" /> <ImageView android:id="@+id/bottom_right_image" android:layout_width="50dp" android:layout_height="0dp" android:layout_weight="0" android:background="#777" /> </LinearLayout> <ImageView android:layout_width="match_parent" android:layout_height="match_parent" android:background="@color/transparent_circle_image"/> </RelativeLayout> 。

<ImageView
        android:layout_width="match_parent"
        android:layout_height="match_parent" 
        android:background="@color/transparent_circle_image"/>

您提到您正在从网址加载图片，因此如果您使用此方法，您可以使用像Picasso这样的库来加载图片，您不必担心等待在绘制圆形图像之前下载所有图像。如果您这样做，每个图像可以独立于其他图像加载。

唯一的缺点是你必须使用带有透明圆圈背景的图像来创建圆形图像的外观。你可以创建一个常规的drawable来使用。或者您可以尝试将其绘制到画布上。这个questions有一个很好的解决方案，可以创建一个绘制透明圆圈的自定义视图。

如果您想使用自定义视图，只需替换

<com.app.view.TransparentCircle
        android:layout_width="match_parent"
        android:layout_height="match_parent"/> 

与

jQuery("li.menu-item-3741 a").eq(0).removeAttr("href");