当前位置： 移动技术网 > 移动技术>移动开发>Android > Android View的background和padding

Android View的background和padding

2019年08月07日  | 移动技术网移动技术  | 我要评论

版权声明：本文为xing_star原创文章，转载请注明出处！

本文同步自

最近在做一个需求，是对im聊天消息设置气泡背景，之前呢，设计师没有特别遵循一定的设计规范，导致，气泡背景有的是.9的图片，有的是自己用xml画出来的背景。这样在给聊天消息设置背景的时候出现了不少的问题。

问题场景回溯:

设置背景，我们常用的api是setbackgroundresource。最开始考虑的比较简单，每条消息都只用setbackgroundresource

接着就碰到了第一个问题，有的消息用的是.9图，有的是xml，整体的效果看起来不是很协调，也就是消息的间隔有大有小，看起来特别丑。

这里我们想到了一个办法，我们需要让不同的气泡上的文本内容看起来间隔差不多，考虑的是设置padding，而不是使用background里面的间隔。对于每一条消息，根据它是什么样的气泡，决定设置padding值的参数。

大致的代码是

setbgcontainerpadding(bgcontainer, systemutils.dip2px(10), systemutils.dip2px(4), systemutils.dip2px(18), systemutils.dip2px(4));
bgcontainer.setbackgroundresource(r.drawable.xxx);//设置背景

然后我就掉入了第二个坑中，发现设置了padding后，效果没变化，一时之间找不到原因，很是恼火。只好先放弃这块工作，去忙其他的了，不知道过了多久，灵感来了，想到了调整padding和background的先后顺序。

bgcontainer.setbackgroundresource(r.drawable.xxx);//设置背景
setbgcontainerpadding(bgcontainer, systemutils.dip2px(10), systemutils.dip2px(4), systemutils.dip2px(18), systemutils.dip2px(4));

一定得是先设置背景，在设置padding值。不能是先设置padding，再设置背景。https://www.jianshu.com/p/4432b19ec6cd 这篇文章深入分析了下原因，对于这块推荐看这篇文章。

到这里大致的效果就比较接近了，但是还是有些item的气泡背景包裹的内容间隔有问题，感觉是view的复用机制（recyclerview,listview的item）在作怪。（此外设置padding值的时候，不要使用view的getpaddingleft()这样的方法，全部给定具体的数值，从源头上避免复用机制）

于是再次修改代码,代码覆盖各种case，相当于每个itemview都手动设置一遍，padding,气泡背景这块不使用view的复用。

完整的处理气泡的代码如下:

private void setbackground(view bgcontainer, int position) {
    conversation conversation = conversationlist.get(position);
    if (position == 0) {
        if (conversation.getissend() == conversation.send_receive_type_send) {
            bgcontainer.setbackgroundresource(r.drawable.balloon_outgoing_normal);//marginleft marginright 10dp
            setbgcontainerpadding(bgcontainer, systemutils.dip2px(10), systemutils.dip2px(4), systemutils.dip2px(18), systemutils.dip2px(4));
        } else {
            bgcontainer.setbackgroundresource(r.drawable.balloon_incoming_normal);
            setbgcontainerpadding(bgcontainer, systemutils.dip2px(18), systemutils.dip2px(4), systemutils.dip2px(10), systemutils.dip2px(4));
        }
        setbgcontainermargin(bgcontainer, systemutils.dip2px(10), 0, systemutils.dip2px(10), 0);
    }
    else if (isdifferenttypepre(position)) {
        if (conversation.getissend() == conversation.send_receive_type_send) {
            bgcontainer.setbackgroundresource(r.drawable.balloon_outgoing_normal);
            setbgcontainerpadding(bgcontainer, systemutils.dip2px(10), systemutils.dip2px(4), systemutils.dip2px(18), systemutils.dip2px(4));
        } else {
            bgcontainer.setbackgroundresource(r.drawable.balloon_incoming_normal);
            setbgcontainerpadding(bgcontainer, systemutils.dip2px(18), systemutils.dip2px(4), systemutils.dip2px(10), systemutils.dip2px(4));
        }
        setbgcontainermargin(bgcontainer, systemutils.dip2px(10), 0, systemutils.dip2px(10), 0);
    } else {
        lineheader.setvisibility(view.gone);
        if (conversation.getissend() == conversation.send_receive_type_send) {
            bgcontainer.setbackgroundresource(r.drawable.green_msg);
            setbgcontainermargin(bgcontainer, 0, systemutils.dip2px(0.5f), systemutils.dip2px(17), systemutils.dip2px(0.5f));
        } else {
            bgcontainer.setbackgroundresource(r.drawable.white_msg);
            setbgcontainermargin(bgcontainer, systemutils.dip2px(17), systemutils.dip2px(0.5f), 0, systemutils.dip2px(0.5f));
        }
        setbgcontainerpadding(bgcontainer, systemutils.dip2px(10), systemutils.dip2px(4), systemutils.dip2px(10), systemutils.dip2px(4));
    }
}

这块的代码，也是调整了好久才完善好，我觉得这块还是很值得总结的。希望对大家有用。

总结:

做这块的工作，碰到了2个问题，设置background跟padding的先后顺序，一定得是先设置background再设置padding；第二个是要考虑到view的复用，但是对于气泡，特定的背景padding值而言，要用代码的方式禁用掉view的复用效果。最终的消息聊天气泡效果很让我满意，整个页面的布局效果也很好，仿的特别成功。

参考资料:

您可能感兴趣的文章:

如对本文有疑问， 点击进行留言回复！！

相关文章:

验证码：
最近更新的文章
大家感兴趣的文章
移动技术网