Как разместить круговой просмотр изображения на макете? - PullRequest
Новая
       0

Как разместить круговой просмотр изображения на макете?

0 голосов
/ 28 сентября 2018

Вот что я пытаюсь достичь:

enter image description here

Но я закончил тем, что создал что-то вроде этого:

enter image description here

Как получить круговой край для изображения?Обратите внимание, что макет, содержащий текст, также имеет перекрывающийся вид изображения.

Вот мой файл макета: 

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:layout_width="match_parent"
    android:background="@drawable/background"
    android:layout_height="wrap_content">

    <FrameLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_margin="10dp"
        android:background="@drawable/background"
        android:orientation="horizontal">

        <de.hdodenhof.circleimageview.CircleImageView
            android:layout_width="120dp"
            android:layout_height="125dp"
            android:layout_marginTop="20dp"
            android:layout_marginLeft="10dp"
            android:background="@color/accent_white"
            android:id="@+id/vendoravatar_imageview"
            android:src="@drawable/avatarnotfound" />
        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="100dp"
            android:gravity="center"
            android:id="@+id/data_layout"
            android:layout_marginTop="30dp"
            android:layout_marginLeft="20dp"
            android:layout_marginRight="10dp"
            android:orientation="horizontal">

            <View
                android:layout_width="100dp"
                android:layout_height="match_parent">

            </View>
            <LinearLayout
                android:layout_width="match_parent"
                android:layout_height="match_parent"
                android:background="@color/accent_white"
                android:orientation="vertical">
                <TextView
                    android:layout_width="match_parent"
                    android:layout_height="wrap_content"
                    android:textSize="16sp"
                    android:typeface="serif"
                    android:layout_marginTop="10dp"
                    android:layout_marginLeft="10dp"
                    android:text="@string/random_vendoruser1"
                    android:id="@+id/vendorusername_textview"/>

                <TextView
                    android:layout_width="match_parent"
                    android:layout_height="wrap_content"
                    android:textSize="14sp"
                    android:layout_marginLeft="10dp"
                    android:typeface="serif"
                    android:text="@string/random_vendoruser1"
                    android:id="@+id/vendoruserdesc_textview"/>

                <LinearLayout
                    android:layout_width="match_parent"
                    android:layout_height="25dp"
                    android:layout_marginTop="5dp"
                    android:layout_marginLeft="10dp"
                    android:layout_marginBottom="5dp"
                    android:orientation="horizontal">

                    <ImageView
                        android:layout_width="wrap_content"
                        android:layout_height="wrap_content"
                        android:layout_marginLeft="10dp"
                        android:layout_gravity="center"
                        android:id="@+id/editvuser_imageview"
                        app:srcCompat="@drawable/ic_pencil"/>

                    <View
                        android:layout_width="2dp"
                        android:layout_height="match_parent"
                        android:layout_marginTop="3dp"
                        android:layout_marginBottom="3dp"
                        android:layout_marginLeft="20dp"
                        android:background="@color/client_grey"
                        ></View>

                    <ImageView
                        android:layout_width="wrap_content"
                        android:layout_height="wrap_content"
                        android:layout_marginLeft="20dp"
                        android:layout_gravity="center"
                        android:id="@+id/deletevuser_imageciew"
                        app:srcCompat="@drawable/ic_dustbin_color"/>

                    <View
                        android:layout_width="2dp"
                        android:layout_height="match_parent"
                        android:layout_marginLeft="20dp"
                        android:layout_marginTop="3dp"
                        android:layout_marginBottom="3dp"
                        android:background="@color/client_grey"
                        ></View>
                    <ImageView
                        android:layout_width="wrap_content"
                        android:layout_height="wrap_content"
                        android:layout_marginLeft="20dp"
                        android:layout_gravity="center"
                        android:id="@+id/lockvuser_imageview"
                        app:srcCompat="@drawable/ic_lock_open_24dp"/>

                </LinearLayout>
            </LinearLayout>
        </LinearLayout>

    </FrameLayout>
</RelativeLayout>

Пожалуйста, помогите, заранее спасибо.Я просто добавляю немного текста, чтобы избежать в основном ошибок кода из stackoverflow.

Ответы [ 2 ]

0 голосов
/ 28 сентября 2018

Для создания кругового ImageView добавьте CircularImageView в XML-код макета и добавьте в свой проект библиотеку CircularImageView или вы также можете получить ее через Gradle: 

implementation 'com.mikhaellopez:circularimageview:3.2.0'

, а затемиспользуйте это в XML, где вы хотите, чтобы это круглое изображение 

<com.mikhaellopez.circularimageview.CircularImageView
        android:layout_width="250dp"
        android:layout_height="250dp"
        android:src="@drawable/image"
        app:civ_border_color="#EEEEEE"
        app:civ_border_width="4dp"
        app:civ_shadow="true"
        app:civ_shadow_radius="10"
        app:civ_shadow_color="#8BC34A"/>
0 голосов
/ 28 сентября 2018

Попробуйте это Удалить android:background="@color/accent_white" из вашего CircleImageView

   <RelativeLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:layout_width="match_parent"
    android:background="@color/colorAccent"
    android:layout_height="wrap_content">

    <FrameLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_margin="10dp"
        android:orientation="horizontal">

        <de.hdodenhof.circleimageview.CircleImageView
            android:layout_width="120dp"
            android:layout_height="125dp"
            android:layout_marginTop="20dp"
            android:layout_marginLeft="10dp"
            android:id="@+id/vendoravatar_imageview"
            android:src="@drawable/nilesh" />
        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="100dp"
            android:gravity="center"
            android:id="@+id/data_layout"
            android:layout_marginTop="30dp"
            android:layout_marginLeft="20dp"
            android:layout_marginRight="10dp"
            android:orientation="horizontal">

            <View
                android:layout_width="100dp"
                android:layout_height="match_parent">

            </View>
            <LinearLayout
                android:layout_width="match_parent"
                android:layout_height="match_parent"
                android:background="accent_white"
                android:orientation="vertical">
                <TextView
                    android:layout_width="match_parent"
                    android:layout_height="wrap_content"
                    android:textSize="16sp"
                    android:typeface="serif"
                    android:layout_marginTop="10dp"
                    android:layout_marginLeft="10dp"
                    android:text="random_vendoruser1"
                    android:id="@+id/vendorusername_textview"/>

                <TextView
                    android:layout_width="match_parent"
                    android:layout_height="wrap_content"
                    android:textSize="14sp"
                    android:layout_marginLeft="10dp"
                    android:typeface="serif"
                    android:text="random_vendoruser1"
                    android:id="@+id/vendoruserdesc_textview"/>

                <LinearLayout
                    android:layout_width="match_parent"
                    android:layout_height="25dp"
                    android:layout_marginTop="5dp"
                    android:layout_marginLeft="10dp"
                    android:layout_marginBottom="5dp"
                    android:orientation="horizontal">

                    <ImageView
                        android:layout_width="wrap_content"
                        android:layout_height="wrap_content"
                        android:layout_marginLeft="10dp"
                        android:layout_gravity="center"
                        android:id="@+id/editvuser_imageview"
                        app:srcCompat="@drawable/ic_delete"/>

                    <View
                        android:layout_width="2dp"
                        android:layout_height="match_parent"
                        android:layout_marginTop="3dp"
                        android:layout_marginBottom="3dp"
                        android:layout_marginLeft="20dp"
                        android:background="@color/colorAccent"
                        />

                    <ImageView
                        android:layout_width="wrap_content"
                        android:layout_height="wrap_content"
                        android:layout_marginLeft="20dp"
                        android:layout_gravity="center"
                        android:id="@+id/deletevuser_imageciew"
                        app:srcCompat="@drawable/ic_close"/>

                    <View
                        android:layout_width="2dp"
                        android:layout_height="match_parent"
                        android:layout_marginLeft="20dp"
                        android:layout_marginTop="3dp"
                        android:layout_marginBottom="3dp"
                        android:background="@color/colorAccent"
                        />
                    <ImageView
                        android:layout_width="wrap_content"
                        android:layout_height="wrap_content"
                        android:layout_marginLeft="20dp"
                        android:layout_gravity="center"
                        android:id="@+id/lockvuser_imageview"
                        app:srcCompat="@drawable/ic_add_black_24dp"/>

                </LinearLayout>
            </LinearLayout>
        </LinearLayout>

    </FrameLayout>
</RelativeLayout>

ВЫХОД

enter image description here

РЕДАКТИРОВАТЬ 

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:layout_width="match_parent"
    android:layout_height="wrap_content">


    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_alignParentEnd="true"
        android:layout_centerInParent="true"
        android:layout_marginLeft="-20dp"
        android:layout_marginTop="20dp"
        android:gravity="center"
        android:background="@color/colorAccent"
        android:layout_toEndOf="@id/vendoravatar_imageview"
        android:orientation="horizontal">


        <LinearLayout
            android:id="@+id/data_layout"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_marginRight="10dp"
            android:layout_marginLeft="20dp"
            android:gravity="center"
            android:orientation="horizontal">

            <LinearLayout
                android:layout_width="match_parent"
                android:layout_height="match_parent"
                android:background="accent_white"
                android:orientation="vertical">

                <TextView
                    android:id="@+id/vendorusername_textview"
                    android:layout_width="match_parent"
                    android:layout_height="wrap_content"
                    android:layout_marginLeft="10dp"
                    android:layout_marginTop="10dp"
                    android:text="random_vendoruser1"
                    android:textSize="16sp"
                    android:typeface="serif" />

                <TextView
                    android:id="@+id/vendoruserdesc_textview"
                    android:layout_width="match_parent"
                    android:layout_height="wrap_content"
                    android:layout_marginLeft="10dp"
                    android:text="random_vendoruser1"
                    android:textSize="14sp"
                    android:typeface="serif" />

                <LinearLayout
                    android:layout_width="match_parent"
                    android:layout_height="25dp"
                    android:layout_marginLeft="10dp"
                    android:layout_marginTop="5dp"
                    android:layout_marginBottom="5dp"
                    android:orientation="horizontal">

                    <ImageView
                        android:id="@+id/editvuser_imageview"
                        android:layout_width="wrap_content"
                        android:layout_height="wrap_content"
                        android:layout_gravity="center"
                        android:layout_marginLeft="10dp"
                        app:srcCompat="@drawable/ic_delete" />

                    <View
                        android:layout_width="2dp"
                        android:layout_height="match_parent"
                        android:layout_marginLeft="20dp"
                        android:layout_marginTop="3dp"
                        android:layout_marginBottom="3dp"
                        android:background="@color/colorAccent" />

                    <ImageView
                        android:id="@+id/deletevuser_imageciew"
                        android:layout_width="wrap_content"
                        android:layout_height="wrap_content"
                        android:layout_gravity="center"
                        android:layout_marginLeft="20dp"
                        app:srcCompat="@drawable/ic_close" />

                    <View
                        android:layout_width="2dp"
                        android:layout_height="match_parent"
                        android:layout_marginLeft="20dp"
                        android:layout_marginTop="3dp"
                        android:layout_marginBottom="3dp"
                        android:background="@color/colorAccent" />

                    <ImageView
                        android:id="@+id/lockvuser_imageview"
                        android:layout_width="wrap_content"
                        android:layout_height="wrap_content"
                        android:layout_gravity="center"
                        android:layout_marginLeft="20dp"
                        app:srcCompat="@drawable/ic_add_black_24dp" />

                </LinearLayout>

            </LinearLayout>

        </LinearLayout>

    </LinearLayout>

    <de.hdodenhof.circleimageview.CircleImageView
        android:id="@+id/vendoravatar_imageview"
        android:layout_width="120dp"
        android:layout_height="125dp"
        android:layout_alignParentStart="true"
        android:layout_centerInParent="true"
        android:layout_marginTop="20dp"
        android:src="@drawable/nilesh" />

</RelativeLayout>

ВЫХОД

enter image description here

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.

Нет похожих вопросов

...