如何根据屏幕大小更改图像视图答案

【问题标题】：How to change imageview according to screen size如何根据屏幕大小更改图像视图
【发布时间】：2017-10-20 03:33:40
【问题描述】：

我尝试在导航标题中添加一个 imageview（个人资料图片）、2 个 textview（用户名和电子邮件）。

这是导航标题的xml代码

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout 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="@dimen/nav_header_height"
android:background="@drawable/side_nav_bar"
android:gravity="bottom"
android:orientation="vertical"
android:paddingBottom="@dimen/activity_vertical_margin"
android:paddingLeft="@dimen/activity_horizontal_margin"
android:paddingRight="@dimen/activity_horizontal_margin"
android:paddingTop="@dimen/activity_vertical_margin"
android:theme="@style/ThemeOverlay.AppCompat.Dark">

<ImageView
    android:id="@+id/header_image"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    app:srcCompat="@android:drawable/sym_def_app_icon" />

<TextView
    android:id="@+id/header_username"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:paddingTop="@dimen/nav_header_vertical_spacing"
    android:textAppearance="@style/TextAppearance.AppCompat.Body1" />

<TextView
    android:id="@+id/header_email"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    />

</LinearLayout>

我通过 picasso 加载图像视图，这是我加载它的代码。

private void setNavHeader() {
    User user = presenter.getUser();
    username.setText(user.getUsername());
    email.setText(user.getEmail());
    try {
        Picasso.with(this)
                .load(user.getUserImage())
                .error(R.drawable.ic_menu_camera)
                .resize(200, 200)
                .into(profileImage);
    }catch(Exception e){
        profileImage.setImageResource(R.drawable.ic_menu_camera);
        LinearLayout.LayoutParams layoutParams = new LinearLayout.LayoutParams(200, 200);
        profileImage.setLayoutParams(layoutParams);
    }
}

这是我的输出但是，它只适合我的手机屏幕尺寸。当我将屏幕尺寸更改为更小的屏幕尺寸时。个人资料图片将覆盖用户名和电子邮件。如何根据屏幕大小改变头像大小不遮住用户名和邮箱？

【问题讨论】：

尝试为 imageview 提供固定的宽度和高度。如果图像尺寸很大，那么 wrap_content 会增加图像尺寸。以 dp 为单位给出宽度和高度
@DemoMail 但是我需要设置多少宽度和高度？不同的屏幕尺寸需要不同的dp值？
不，如果你在dp中给出大小，那么它会根据设备自动调整，你不必担心设备大小
give 60dp X 60dp 看看你的问题能不能解决

标签： android xml android-layout imageview screen-size

【解决方案1】：

首先，删除 try and catch。隐藏此错误并不好，只需检查可能的 url 问题并手动设置图像，就像在缓存块中一样。如果您使用字符串或 Uri，请检查用户图像 url 是否为 其为空 或 null。

关键是您使用的是LinearLayout，它会注意子视图不会重叠。如果您更改ImageView 的高度，您的TextViews 可能会被切到底部，因为您的android:layout_height="@dimen/nav_header_height" 值定义的空间不足。

在 XML 中设置您希望的高度和宽度，例如：

<ImageView
    android:id="@+id/header_image"
    android:layout_width="100dp"
    android:layout_height="100dp"
    app:srcCompat="@android:drawable/sym_def_app_icon" />

只需找到您的正确尺寸/询问您的设计师（如果您使用），此图片的合适尺寸是多少。这将改变ImageView 的视图边界，显示的图像当然取决于这个大小。

你可以稍微玩一下imageView的以下属性：

android:scaleType
android:adjustViewBounds

这会改变图像在ImageView 范围内的显示方式。

使用 dp 而不是像素，这也需要注意，您的图像视图可以在不同的设备尺寸上得到很好的缩放。

你可以玩毕加索的功能，比如：

Picasso.with(this)
            .load(user.getUserImage())
            .error(R.drawable.ic_menu_camera)

            .placeholder(...)

            .resize(imageView.getMeasuredWidth(), imageView.getMeasuredHeight()) // <-- is needed for some functions

            .fit()// <--
            .centerCrop()// <--
            .centerInside()// <--

            .into(profileImage);

只需找到能给你带来最佳结果的函数。

【讨论】：