Java – ImageViews to Circular LinearLayout

ImageViews to Circular LinearLayout… here is a solution to the problem.

ImageViews to Circular LinearLayout

I have some ImageView in this circular LinearLayout. Here is my simple code:

<LinearLayout
    android:layout_width="128dp"
    android:layout_height="128dp"
    android:id="@+id/point_image_table1"
    android:orientation="vertical"
    android:drawable="@drawable/image_view_style"
    android:layout_below="@+id/repoint_p_name"
    android:weightSum="4">

<ImageView
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:layout_weight="1"
        android:scaleType="centerCrop"
        android:id="@+id/imageView61"
        android:layout_marginBottom="1dp"
        android:src="@color/realRed"/>
        <ImageView
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:layout_weight="1"
            android:id="@+id/imageView71"
            android:layout_marginRight="1dp"
            android:layout_marginEnd="1dp"
            android:scaleType="centerCrop"
            android:src="@drawable/pinpoint_logo_large"/>
        <ImageView
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:layout_weight="1"
            android:id="@+id/imageView51"
            android:scaleType="centerCrop"
            android:src="@drawable/pinpoint_logo_large"/>
        <ImageView
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:layout_weight="1"
            android:layout_marginLeft="1dp"
            android:layout_marginStart="1dp"
            android:scaleType="centerCrop"
            android:id="@+id/imageView81"
            android:src="@drawable/pinpoint_logo_large"/>

</LinearLayout>

But the image corner covers the LinearLayout

corner, and if you don’t see LinearLayout, a border appears at the end.
How do I fix it? I need to set some ImageView to a linear layout, and I also need to set the borders and rounded corners to a linear layout.

Thank you.

Edit: I want something like this (four images in the rounded layout):
enter image description here

Solution

I suggest you use a cardview with multiple images, so that you can easily get a collage view, try this

<android.support.v7.widget.CardView
        android:layout_width="300dp"
        android:layout_height="300dp"
        android:layout_marginTop="10dp"
        android:layout_marginLeft="15dp"
        android:layout_marginRight="15dp"
        card_view:cardCornerRadius="10dp">

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
        android:layout_width="300dp"
        android:layout_height="300dp">

<LinearLayout
            android:id="@+id/left_container"
            android:layout_alignParentTop="true"
            android:layout_alignParentLeft="true"
            android:layout_width="150dp"
            android:layout_height="300dp"
            android:orientation="vertical">

<ImageView
                android:id="@+id/dog"
                android:layout_width="150dp"
                android:layout_height="0dp"
                android:layout_weight="1"

android:background="@drawable/mmm" />

<ImageView
                android:id="@+id/bottom_left_image"
                android:layout_width="150dp"
                android:layout_height="0dp"
                android:layout_weight="1"
                android:layout_marginTop="5dp"
                android:background="@drawable/mmm" />

</LinearLayout>

<LinearLayout
            android:id="@+id/right_container"
            android:layout_width="150dp"
            android:layout_height="300dp"
            android:layout_marginLeft="5dp"
            android:layout_toRightOf="@+id/left_container"
            android:orientation="vertical">

<ImageView
                android:id="@+id/top_right_image"
                android:layout_width="150dp"
                android:layout_height="0dp"
                android:layout_weight="1"
                android:background="@drawable/mmm" />

<ImageView
                android:id="@+id/bottom_right_image"
                android:layout_width="50dp"
                android:layout_height="0dp"
                android:layout_weight="0"
                android:background="@drawable/mmm" />

</LinearLayout>

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

</RelativeLayout>

</android.support.v7.widget.CardView>

Output

enter image description here

Related Problems and Solutions