如何根据屏幕大小更改imageview

时间:2017-10-20 03:33:41

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

我尝试将一个imageview(个人资料图片),2个textview(用户名和电子邮件)添加到导航标题中。

这是导航标题的

<?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加载了imageview,这是我加载它的代码。

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);
    }
}

这是我的输出 enter image description here 但是,它只适合我的手机屏幕尺寸。当我将屏幕尺寸更改为更小的屏幕尺寸时。个人资料图片将覆盖用户名和电子邮件。如何根据屏幕大小更改配置文件图像的大小,然后它不会覆盖用户名和电子邮件?

1 个答案:

答案 0 :(得分:1)

首先,删除try和catch。隐藏此错误并不好,只需检查可能的URL问题并手动设置图像,就像在缓存块中一样。如果您使用String或Uri,请检查其空 null 的userimage网址。

关键是你正在使用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);

只需找到能够带来最佳效果的功能。