如何将位图放入圆角正方形中?

问题描述 投票:0回答:2

我正在使用 Android Studio,我希望能够从图库中拾取图像,调整其大小并通过保持正确的宽高比使其适合圆角正方形(约 300x300 像素)。 目前,我可以调整它的大小并将其显示为圆形。

 FixBitmap = MediaStore.Images.Media.getBitmap(getContentResolver(), uri);
 bitmap_to_save = scaleBitmapAndKeepRation(FixBitmap, 320, 320);
               
 RoundedBitmapDrawable roundDrawable = RoundedBitmapDrawableFactory.create(getResources(), bitmap_to_save);
 roundDrawable.setCircular(true);
 p_avatar.setImageDrawable(roundDrawable);

但是,我想知道是否可以使位图看起来像我所附的图像。此外,对我来说,在不丢失原始纵横比的情况下调整图像大小非常重要。

这并不是一个完美的方形圆角图形,所以我不确定是否可以在 Android 中做到这一点。

请记住,我根据用户操作动态更改代码内的图像视图。所以这不是静态图像,如果用户上传新图像,我会用新图像替换原始内容。

编辑 #1 于 5 月 20 日

这是我的图像视图“头像”的 XML 代码:

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:id="@+id/ll_main"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical"
    tools:context="loginpackage.social.com.ui.profile.ProfileActivity">

    <include layout="@layout/custom_toolbar_shadow" />

    <ScrollView
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:fillViewport="true">

        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:gravity="center_horizontal"
            android:orientation="vertical"
            android:paddingTop="@dimen/_20sdp">


            <ImageView
                android:id="@+id/avatar"
                android:layout_width="137dp"
                android:layout_height="150dp"
                android:layout_gravity="center"
                android:clickable="true"
                android:paddingBottom="@dimen/_10sdp"
                android:paddingTop="@dimen/_10sdp"
                />


            <LinearLayout
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:layout_marginTop="@dimen/_20sdp"
                android:orientation="vertical"
                android:paddingLeft="@dimen/_16sdp"
                android:paddingRight="@dimen/_16sdp">

                <TextView
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:text="@string/profileActivity_name"
                    android:textSize="@dimen/_14sdp" />

                <EditText
                    android:id="@+id/et_fullname"
                    android:layout_width="match_parent"
                    android:layout_height="wrap_content"
                    android:layout_marginTop="@dimen/_5sdp"
                    android:background="@color/colorWhite"
                    android:hint="@string/signActivity_fullname"
                    android:imeOptions="actionDone"
                    android:inputType="textNoSuggestions"
                    android:maxLines="1"
                    android:padding="@dimen/_10sdp" />

                <TextView
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:layout_marginTop="@dimen/_10sdp"
                    android:text="@string/profileActivity_email"
                    android:textSize="@dimen/_14sdp" />

                <EditText
                    android:id="@+id/et_email"
                    android:layout_width="match_parent"
                    android:layout_height="wrap_content"
                    android:layout_marginTop="@dimen/_5sdp"
                    android:background="@drawable/editext_back_login"
                    android:hint="@string/mainActivity_email"
                    android:imeOptions="actionNext"
                    android:inputType="textEmailAddress|textNoSuggestions"
                    android:maxLines="1"
                    android:padding="@dimen/_10sdp" />

                <Button
                    android:id="@+id/btn_update"
                    android:layout_width="match_parent"
                    android:layout_height="wrap_content"
                    android:layout_marginTop="@dimen/_20sdp"
                    android:background="@color/colorSignuoBtn"
                    android:text="@string/profileActivity_update"
                    android:textColor="@color/colorWhite"
                    android:textSize="@dimen/_12sdp"
                    android:visibility="invisible" />

                <TextView
                    android:id="@+id/txt_logout"
                    android:layout_width="match_parent"
                    android:layout_height="wrap_content"
                    android:layout_gravity="center"
                    android:layout_marginBottom="@dimen/_10sdp"
                    android:layout_marginTop="@dimen/_20sdp"
                    android:background="@drawable/button_logout_profile"
                    android:foreground="?attr/selectableItemBackgroundBorderless"
                    android:gravity="center"
                    android:paddingBottom="@dimen/_12sdp"
                    android:paddingTop="@dimen/_12sdp"
                    android:text="@string/profileActivity_logout"
                    android:textSize="@dimen/_12sdp" />
            </LinearLayout>
        </LinearLayout>
    </ScrollView>
</LinearLayout>

编辑#2

目前,我正在使用毕加索对图像进行圆角处理,似乎 工作顺利。

问题是我想始终保持相同的图片尺寸(350x350px)和宽高比。怎么可能做到呢?

 Transformation transformation = new RoundedTransformationBuilder()
                    .borderColor(Color.GREEN)
                    .borderWidthDp(2)
                    .cornerRadiusDp(15)
                    .oval(false)
                    .build();

            Picasso.get().load("http://www.server.com/uploads/avatars/"+Conts.USERINFO.getId()).transform(transformation).memoryPolicy(MemoryPolicy.NO_CACHE, MemoryPolicy.NO_STORE).networkPolicy(NetworkPolicy.NO_CACHE) .into(p_avatar);

编辑#3

 <com.makeramen.roundedimageview.RoundedImageView
            xmlns:app="http://schemas.android.com/apk/res-auto"
            android:id="@+id/avatar"
            android:layout_width="160dp"
            android:layout_height="160dp"
            android:src="@drawable/adduserprofile"
            android:scaleType="centerCrop"
            app:riv_border_width="2dip"
            app:riv_border_color="#333333"
            app:riv_mutate_background="true"
            app:riv_oval="false"
            app:riv_corner_radius_bottom_left="20dp"
            app:riv_corner_radius_top_right="20dp"
            />

为什么如果我为

riv_corner_radius_top_right
设置不同的值,应用程序就会崩溃? 例如,如果我设置:

 app:riv_corner_radius_bottom_left="20dp"
 app:riv_corner_radius_top_right="10dp"

我收到此错误:

  E/AndroidRuntime: FATAL EXCEPTION: main
                  Process: loginpackage.social.com, PID: 25495
                  java.lang.RuntimeException: Unable to start activity ComponentInfo{loginpackage.social.com/loginpackage.social.com.ui.profile.ProfileActivity}: android.view.InflateException: Binary XML file line #24: Error inflating class com.makeramen.roundedimageview.RoundedImageView
                      at android.app.ActivityThread.performLaunchActivity(ActivityThread.java:2689)
                      at android.app.ActivityThread.handleLaunchActivity(ActivityThread.java:2754)
                      at android.app.ActivityThread.access$900(ActivityThread.java:177)
                      at android.app.ActivityThread$H.handleMessage(ActivityThread.java:1448)
                      at android.os.Handler.dispatchMessage(Handler.java:102)
                      at android.os.Looper.loop(Looper.java:145)
                      at android.app.ActivityThread.main(ActivityThread.java:5938)
                      at java.lang.reflect.Method.invoke(Native Method)
                      at java.lang.reflect.Method.invoke(Method.java:372)
                      at com.android.internal.os.ZygoteInit$MethodAndArgsCaller.run(ZygoteInit.java:1400)
                      at com.android.internal.os.ZygoteInit.main(ZygoteInit.java:1195)
                   Caused by: android.view.InflateException: Binary XML file line #24: Error inflating class com.makeramen.roundedimageview.RoundedImageView
                      at android.view.LayoutInflater.createView(LayoutInflater.java:640)
                      at android.view.LayoutInflater.createViewFromTag(LayoutInflater.java:750)
                      at android.view.LayoutInflater.rInflate(LayoutInflater.java:813)
                      at android.view.LayoutInflater.rInflate(LayoutInflater.java:821)
                      at android.view.LayoutInflater.rInflate(LayoutInflater.java:821)
                      at android.view.LayoutInflater.inflate(LayoutInflater.java:511)
                      at android.view.LayoutInflater.inflate(LayoutInflater.java:415)
                      at android.view.LayoutInflater.inflate(LayoutInflater.java:366)
                      at android.support.v7.app.AppCompatDelegateImplV9.setContentView(AppCompatDelegateImplV9.java:287)
                      at android.support.v7.app.AppCompatActivity.setContentView(AppCompatActivity.java:139)
                      at loginpackage.social.com.ui.profile.ProfileActivity.onCreate(ProfileActivity.java:93)
                      at android.app.Activity.performCreate(Activity.java:6288)
                      at android.app.Instrumentation.callActivityOnCreate(Instrumentation.java:1119)
                      at android.app.ActivityThread.performLaunchActivity(ActivityThread.java:2642)
                      at android.app.ActivityThread.handleLaunchActivity(ActivityThread.java:2754) 
                      at android.app.ActivityThread.access$900(ActivityThread.java:177) 
                      at android.app.ActivityThread$H.handleMessage(ActivityThread.java:1448) 
                      at android.os.Handler.dispatchMessage(Handler.java:102) 
                      at android.os.Looper.loop(Looper.java:145) 
                      at android.app.ActivityThread.main(ActivityThread.java:5938) 
                      at java.lang.reflect.Method.invoke(Native Method) 
                      at java.lang.reflect.Method.invoke(Method.java:372) 
                      at com.android.internal.os.ZygoteInit$MethodAndArgsCaller.run(ZygoteInit.java:1400) 
                      at com.android.internal.os.ZygoteInit.main(ZygoteInit.java:1195) 
                   Caused by: java.lang.reflect.InvocationTargetException
                      at java.lang.reflect.Constructor.newInstance(Native Method)
                      at java.lang.reflect.Constructor.newInstance(Constructor.java:288)
                      at android.view.LayoutInflater.createView(LayoutInflater.java:614)
                      at android.view.LayoutInflater.createViewFromTag(LayoutInflater.java:750) 
                      at android.view.LayoutInflater.rInflate(LayoutInflater.java:813) 
                      at android.view.LayoutInflater.rInflate(LayoutInflater.java:821) 
                      at android.view.LayoutInflater.rInflate(LayoutInflater.java:821) 
                      at android.view.LayoutInflater.inflate(LayoutInflater.java:511) 
                      at android.view.LayoutInflater.inflate(LayoutInflater.java:415) 
                      at android.view.LayoutInflater.inflate(LayoutInflater.java:366) 
                      at android.support.v7.app.AppCompatDelegateImplV9.setContentView(AppCompatDelegateImplV9.java:287) 
                      at android.support.v7.app.AppCompatActivity.setContentView(AppCompatActivity.java:139) 
                      at loginpackage.social.com.ui.profile.ProfileActivity.onCreate(ProfileActivity.java:93) 
                      at android.app.Activity.performCreate(Activity.java:6288) 
                      at android.app.Instrumentation.callActivityOnCreate(Instrumentation.java:1119) 
                      at android.app.ActivityThread.performLaunchActivity(ActivityThread.java:2642) 
                      at android.app.ActivityThread.handleLaunchActivity(ActivityThread.java:2754) 
                      at android.app.ActivityThread.access$900(ActivityThread.java:177) 
                      at android.app.ActivityThread$H.handleMessage(ActivityThread.java:1448) 
                      at android.os.Handler.dispatchMessage(Handler.java:102) 
                      at android.os.Looper.loop(Looper.java:145) 
                      at android.app.ActivityThread.main(ActivityThread.java:5938) 
                      at java.lang.reflect.Method.invoke(Native Method) 
                      at java.lang.reflect.Method.invoke(Method.java:372) 
                      at com.android.internal.os.ZygoteInit$MethodAndArgsCaller.run(ZygoteInit.java:1400) 
                      at com.android.internal.os.ZygoteInit.main(ZygoteInit.java:1195) 
                   Caused by: java.lang.IllegalArgumentException: Multiple nonzero corner radii not yet supported.
                      at com.makeramen.roundedimageview.RoundedDrawable.setCornerRadius(RoundedDrawable.java:507)
                      at com.makeramen.roundedimageview.RoundedImageView.updateAttrs(RoundedImageView.java:368)
                      at com.makeramen.roundedimageview.RoundedImageView.updateDrawableAttrs(RoundedImageView.java:318)
                      at com.makeramen.roundedimageview.RoundedImageView.<init>(RoundedImageView.java:163)
                      at com.makeramen.roundedimageview.RoundedImageView.<init>(RoundedImageView.java:86)
                      at java.lang.reflect.Constructor.newInstance(Native Method) 
                      at java.lang.reflect.Constructor.newInstance(Constructor.java:288) 
                      at android.view.LayoutInflater.createView(LayoutInflater.java:614) 
                      at android.view.LayoutInflater.createViewFromTag(LayoutInflater.java:750) 
                      at android.view.LayoutInflater.rInflate(LayoutInflater.java:813) 
                      at android.view.LayoutInflater.rInflate(LayoutInflater.java:821) 
                      at android.view.LayoutInflater.rInflate(LayoutInflater.java:821) 
                      at android.view.LayoutInflater.inflate(LayoutInflater.java:511) 
                      at android.view.LayoutInflater.inflate(LayoutInflater.java:415) 
                      at android.view.LayoutInflater.inflate(LayoutInflater.java:366) 
                      at android.support.v7.app.AppCompatDelegateImplV9.setContentView(AppCompatDelegateImplV9.java:287) 
                      at android.support.v7.app.AppCompatActivity.setContentView(AppCompatActivity.java:139) 
                      at loginpackage.social.com.ui.profile.ProfileActivity.onCreate(ProfileActivity.java:93) 
                      at android.app.Activity.performCreate(Activity.java:6288) 
                      at android.app.Instrumentation.callActivityOnCreate(Instrumentation.java:1119) 
                      at android.app.ActivityThread.performLaunchActivity(ActivityThread.java:2642) 
                      at android.app.ActivityThread.handleLaunchActivity(ActivityThread.java:2754) 
                      at android.app.ActivityThread.access$900(ActivityThread.java:177) 
                      at android.app.ActivityThread$H.handleMessage(ActivityThread.java:1448) 
                      at android.os.Handler.dispatchMessage(Handler.java:102) 
                      at android.os.Looper.loop(Looper.java:145) 
                      at android.app.ActivityThread.main(ActivityThread.java:5938) 
                      at java.lang.reflect.Method.invoke(Native Method) 
                      at java.lang.reflect.Method.invoke(Method.java:372) 
                      at com.android.internal.os.ZygoteInit$MethodAndArgsCaller.run(ZygoteInit.java:1400) 
                      at com.android.internal.os.ZygoteInit.main(ZygoteInit.java:1195) 
android imageview android-bitmap aspect-ratio
2个回答
1
投票

如果您在公司从事项目,您不应该花时间来管理这些类型的逻辑。

相反,您可以只使用已经完成出色工作的库。 请参阅https://github.com/vinc3m1/RoundedImageView

你的 ImageView 会像

<com.makeramen.roundedimageview.RoundedImageView
        xmlns:app="http://schemas.android.com/apk/res-auto"
        android:id="@+id/imageView1"
        android:src="@drawable/photo1"
        android:scaleType="centerCrop"
        app:riv_corner_radius="30dip"
        app:riv_border_width="2dip"
        app:riv_border_color="#333333"
        app:riv_mutate_background="true"
        app:riv_tile_mode="repeat"
        app:riv_oval="true" />

和依赖性

repositories {
    mavenCentral()
}

dependencies {
    compile 'com.makeramen:roundedimageview:2.3.0'
}

更新

您似乎对 android 很陌生,如果您不理解 id 和 src,不用担心!

基本上

id
是您创建并引用的唯一 ID imageView1 如果你在你的java代码中findViewById(R.id.imageView1)。

有关 id 的更多信息:Android 中“@id/”和“@+id/”之间的区别

src
是该图像的源图像文件,位于您的可绘制目录中。

关于您的问题

您可以使用符合您要求的不同ImageView ScaleType。 我认为您使用的

android:scaleType="centerCrop"
适合您在 imageView 中的图像。

我还在上面的答案中编辑了scaleType。如果这不符合您的要求,您可以使用任何这些规模类型

更新2设置宽度和高度,可以设置

layout_width
layout_height
属性。就像下面这样。

 <com.makeramen.roundedimageview.RoundedImageView
            xmlns:app="http://schemas.android.com/apk/res-auto"
            android:id="@+id/imageView1"
            android:src="@drawable/photo1"
            android:scaleType="centerCrop"
            app:riv_corner_radius="30dip"
            app:riv_border_width="2dip"
            app:riv_border_color="#333333"
            app:riv_mutate_background="true"
            app:riv_tile_mode="repeat"
            app:riv_oval="true" 
            android:layout_width="350dp"
            android:layout_height="350dp"/>

请参阅“px”、“dip”、“dp”和“sp”之间有什么区别?了解有关 android 中 sp、dp、px 的更多详细信息。


1
投票

我写了一个

MaskView
,可以让你将图像遮盖成任何形状,包括中间的孔和部分透明。这是很多代码,而且是我很久以前写的,所以我自己不会在不检查它的情况下使用它。但它的本质是一个带有 alpha 蒙版的
ImageView
。当它绘制自身时,它会为自身及其后面的任何内容绘制两个位图,并使用遮罩将它们组合起来。

© www.soinside.com 2019 - 2024. All rights reserved.