Android 中TextView的使用imageview被压缩问题解决办法

Android 中TextView的使用imageview被压缩问题解决办法

看下运行效果图:

今天解bug的时候遇到一个奇怪的问题:listview的item由一个textview和一个imageview组成,父布局是线性水平排列。我的本意是imageview显示相同的图片,textview显示文本,但是运行程序后发现,当某个textview的文本较多时,imageview会被压缩,刚开始没注意,检查代码了好久。

代码示例如下:

<!--文本少的item-->
<LinearLayout
android:id="@+id/ll"
android:layout_width="match_parent"  android:layout_height="wrap_content"
android:background="#e6e9ed"
android:gravity="center_vertical|right">
<TextView
android:id="@+id/title"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:gravity="bottom"
android:text="我们右边引用的是同一张图片"
android:textSize="16sp" />
<ImageView
android:id="@+id/icon"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="17dp"
android:layout_marginRight="23dp"
android:background="@drawable/test" />
</LinearLayout>

<!--文本多的item-->
<LinearLayout
android:id="@+id/ll"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="50dp"
android:background="#e6e9ed"
android:gravity="center_vertical|right">
<TextView
android:id="@+id/title"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:gravity="bottom"
android:text="我们右边引用的是同一张图片,我字数多"
android:textSize="16sp" />
<ImageView
android:id="@+id/icon"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="17dp"
android:layout_marginRight="23dp"
android:background="@drawable/test" />
</LinearLayout>

可以发现,第二个布局中,右边图片被“挤扁”了。为什么会出现这种情况?其实很简单,是textview宽度自适应搞的鬼。水平线形布局中,我们虽然设置了imageview与左右的偏移(margin)值,但是由于自布局textview与imageview是按顺序排列的,textview会首先完成它的自适应,导致字数过多的时候会把右边的imageview压缩,此时imageview的左右margin值还是我们设置的。

那么,怎么设置才能让文本框显示较多文字而又不挤压右边的imageview呢?

答案很简单,还是要在textview的宽度上做文章了。只需要:

textview的width属性依然设置为:wrap_content自适应,再加上一个权重属性即可:weight="1".这样,textview就会占据水平剩下的空间,而不会去挤压右边的imageivew了。

代码如下:

<LinearLayout
android:id="@+id/ll"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="50dp"
android:background="#e6e9ed"
android:gravity="center_vertical|right">
<TextView
android:id="@+id/title"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:layout_weight="1"
android:ellipsize="end"
android:gravity="bottom"
android:singleLine="true"
android:text="我们右边引用的是同一张图片,我字数多"
android:textSize="16sp" />
<ImageView
android:id="@+id/icon"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="17dp"
android:layout_marginRight="23dp"
android:background="@drawable/test" />

运行效果就正常了:

感谢阅读,希望能帮助到大家,谢谢大家对本站的支持!

时间: 2017-04-08

Android TextView和ImageView简单说明

复制代码 代码如下: <?xml version="1.0" encoding="utf-8"?>  <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"      android:layout_width="match_parent"      android:layout_height="match_pa

Android中TextView和ImageView实现倾斜效果

TextView倾斜: 想做一个倾斜的TextView,想海报上显示的那样 ,在网上找例子一直不能实现,看了看TextView源码,发现很简单,为方便像我一样糊涂的孩纸,贴出来了. 首先需要先自定义一个TextView public class MyTextView extends TextView{ public MyTextView(Context context, AttributeSet attrs) { super(context, attrs); } @Override protec

Android自定义TextView实现文字倾斜效果

前言 由于Android自带的TextView控件没有提供倾斜的(我暂时没有找到),我们可以自定义控件来实现,下面首先来看我们实现的效果图. TextView文字倾斜 其实实现很简单,下面我们来看实现步骤: 1.新建一个类 LeanTextView继承TextView public class LeanTextView extends TextView { public int getmDegrees() { return mDegrees; } public void setmDegrees(

最近较流行的效果 Android自定义View实现倾斜列表/图片

先看看效果图: 实现思路:擦除图片相应的角,然后层叠图片,产生倾斜效果 代码实现: 1.定义属性 在values文件夹下的attrs文件添加以下代码 <resources> <declare-styleable name="TiltView"> <attr name="type" format="integer" /> </declare-styleable> </resources>

Android自定义View基础开发之图片加载进度条

学会了Paint,Canvas的基本用法之后,我们就可以动手开始实践了,先写个简单的图片加载进度条看看. 按照惯例,先看效果图,再决定要不要往下看: 既然看到这里了,应该是想了解这个图片加载进度条了,我们先看具体用法,再看自定义View的实现: <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:custom="http://schemas.android.co

Android自定义View圆形和拖动圆跟随手指拖动

单纯的自定义一个圆非常简单 只需要几步就完成 拖动圆添加实现触摸事件即可 我在第一次自定义View圆遇到的小问题: 1.拖动圆的话在xml里面设置的自定义圆的宽和高是它能活动的空间的大小 不是圆控件的大小 如果你定义了100dp 拖动它的时候超过100dp这个距离这个圆就会看不见 就像下面这样 如果想活动于整个屏幕直接给宽和高match_parent属性就好了 2.在布局里自定的view会提示编译 点击Build编译一下就好了 下面开始写代码: 先是单纯的创建一个圆形 创建一个类继承View 实

Android自定义View实现loading动画加载效果

项目开发中对Loading的处理是比较常见的,安卓系统提供的不太美观,引入第三发又太麻烦,这时候自己定义View来实现这个效果,并且进行封装抽取给项目提供统一的loading样式是最好的解决方式了. 先自定义一个View,继承自LinearLayout,在Layout中,添加布局控件 /** * Created by xiedong on 2017/3/7. */ public class Loading_view extends LinearLayout { private Context m

Android自定义View实现简单的圆形Progress效果

先给大家展示下效果图,如果感觉不错,请参考实现思路: 我们要实现一个自定义的再一个圆形中绘制一个弧形的自定义View,思路是这样的: 先要创建一个类ProgressView,继承自View类,然后重写其中的两个构造方法,一个是一个参数的,一个是两个参数的,因为我们要在xml文件中使用该自定义控件,所以必须要定义这个两个参数的构造函数.创建完了这个类后,我们先不去管它,先考虑我们实现的这个自定义View,我们想让它的哪些部分可以由使用者自己指定,比如说这个Demo中我们让他的外面圆的外边框颜色和宽

Android自定义View 实现水波纹动画引导效果

一.实现效果图 二.实现代码 1.自定义view package com.czhappy.showintroduce.view; import android.content.Context; import android.graphics.Bitmap; import android.graphics.Canvas; import android.graphics.Color; import android.graphics.Paint; import android.graphics.Pat

Android开发之自定义view实现通讯录列表A~Z字母提示效果【附demo源码下载】

本文实例讲述了Android开发之自定义view实现通讯录列表A~Z字母提示效果.分享给大家供大家参考,具体如下: 开发工具:eclipse 运行环境:htc G9 android2.3.3 话不多说,先看效果图 其实左右边的A~Z是一个自定义的View,它直接覆盖在ListView上. MyLetterListView: public class MyLetterListView extends View { OnTouchingLetterChangedListener onTouching

Android自定义View实现钟摆效果进度条PendulumView

在网上看到了一个IOS组件PendulumView,实现了钟摆的动画效果.由于原生的进度条确实是不好看,所以想可以自定义View实现这样的效果,以后也可以用于加载页面的进度条. 废话不多说,先上效果图 底部黑边是录制时不小心录上的,可以忽略. 既然是自定义View我们就按标准的流程来,第一步,自定义属性 自定义属性 建立属性文件 在Android项目的res->values目录下新建一个attrs.xml文件,文件内容如下: <?xml version="1.0" enco

Android自定义view实现太极效果实例代码

Android自定义view实现太极效果实例代码 之前一直想要个加载的loading.却不知道用什么好,然后就想到了太极图标,最后效果是有了,不过感觉用来做loading简直丑到爆!!! 实现效果很简单,我们不要用什么贝塞尔曲线啥的,因为太极无非就是圆圆圆,只要画圆就ok了.来上代码: 因为有黑有白,所以定义2个画笔分别为黑和白. private void inital() { whitePaint = new Paint(); whitePaint.setAntiAlias(true); wh

Android自定义View实现弹性小球效果

照例先看效果图 自定义代码示例 public class BezierView extends View { Paint paint;//画笔 Path path;//路径 int radius = 50;//圆的半径 int time = 100;//计数时长 int index; int offsetIndex; float viewX, viewY;//图形中心点坐标 float width;//屏幕宽度 float partWidth;//屏幕宽度的1/4 int paddingLeft