手把手教你快速搞定京东APP设置页面布局

时间:2024-03-22 20:58:17

[ 爱开发]陪伴你一起成长,一起进步


今天给大家分享的是关于自定义控件组合,节省开发时间。


如果你对自定义组合控件不怎么熟悉,建议你先浏览这篇文章《手把手教你开发自定义控件

今天要分享的控件可以帮忙我们快速完成设置页面布局。譬如下面的京东设置页面。

手把手教你快速搞定京东APP设置页面布局

 其中像地址管理这一行,我们一般可以用TextView这个控件来实现

<TextView
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:layout_centerVertical="true"
    android:drawableRight="@drawable/icon_right"
    android:text="地址管理" />

对于右侧的箭头,我们可以借助TextView的属性drawableRight

来实现,至于底部的线条,我们可以这样做

<View
    android:layout_width="match_parent"
    android:layout_height="1px"
    android:background="#bbbbbb" />

这样做没错,几行还可以接受,要是碰到再稍微复杂一点,譬如这样的

 

手把手教你快速搞定京东APP设置页面布局



如果再按照我们之前的做法,就得要放两个TextView和一个ImageView控件

这样我们的内心是不是开始有点抵触了。

再或者这样的:

手把手教你快速搞定京东APP设置页面布局


有了NiceTextView,我们就不用那么麻烦了。

对于左边文字,右边图标的,我们可以这样:

手把手教你快速搞定京东APP设置页面布局


<com.aikaifa.nicetextview.NiceTextView
    android:layout_width="match_parent"
    android:layout_height="50dp"
    ntv:sLeftTextString="地址管理"
    ntv:sRightIconRes="@drawable/icon_right" />

 

 

手把手教你快速搞定京东APP设置页面布局


<com.aikaifa.nicetextview.NiceTextView
    android:id="@+id/tv_login"
    android:layout_width="match_parent"
    android:layout_height="100dp"
    ntv:sLeftIconRes="@drawable/head_default"
    ntv:sLeftTextString="登录/注册"
    ntv:sRightIconRes="@drawable/icon_right" />

 

<com.aikaifa.nicetextview.NiceTextView
    android:layout_width="match_parent"
    android:layout_height="50dp"
    ntv:sLeftTextString="账户安全"
    ntv:sRightIconRes="@drawable/icon_right"
    ntv:sRightTextColor="@color/text_right"
    ntv:sRightTextString="密码和支付等管理\u3000" />

 

 

sLineShow

 

控件点击事件:


/**
 * 点击事件
 *
 * @param listener listener对象
 * @return 返回对象
 */
public NiceTextView setOnNiceTextViewClickListener(OnNiceTextViewClickListener listener) {
    onNiceTextViewClickListener = listener;
    return this;
}

public interface  OnNiceTextViewClickListener {
    void onNiceTextViewClick() ;
    void onLeftTopClick() ;
    void onLeftBottomClick();
    void onLeftBottomClickTwo();
}


项目地址:

https://github.com/88ios/NiceTextView/

【END】

手把手教你快速搞定京东APP设置页面布局