Code Monkey home page Code Monkey logo

superedittext's Introduction

SuperEditText

Click to see English Document

  • 作者:Carson_Ho
  • 概述

示意图

注:关于该开源项目的意见 & 建议可在Issue上提出。欢迎 Star !

1. 简介

一款 简单 & 好用SuperEditText控件

Github地址:Super_EditText

效果图

2. 功能介绍

2.1 需求场景

对于 EditText来说,一般的需求有:

  • 方便用户因出现输入错误而进行2次输入
  • 标识用户正在填写项
  • 根据具体场景增加一定的UI元素

2.2 功能需求

根据需求场景,得出EditText需要具备的功能如下:

  • 一键删除
  • 丰富的自定义样式:左侧图标、删除功能图标、分割线 & 光标 样式变化。具体如下图:

示意图

注:该样式的设置是系统自带的 API 所不具备的

  • 功能列表

示意图

2.3 功能示意

效果图

3. 特点

对比市面上EditText控件,该控件Super_EditText 的特点是:

3.1 功能实用

  • 一键删除功能 在需求中非常常见,现将其封装后更加方便使用
  • 可自定义样式程度高(比自带的强大 & 方便),不复杂却能满足一般的EditText使用需求

可自定义样式如下:(注:该样式的设置是系统自带的 API 所不具备的)

示意图

3.2 使用简单

仅需要简单的xml属性配置

下面1节会详细介绍其使用方法

3.3 二次开发成本低

所以,在其上做二次开发 & 定制化成本非常低。

4. 具体使用

该款Super_EditText使用非常简单,仅需2步:

步骤1:导入控件库

主要有 Gradle & Maven 2种方式:

  • 方式1:Gradle引入依赖 build.Gradle
dependencies {
    compile 'com.carson_ho:Super_EditText:1.0.0'
}
  • 方式2:Maven引入依赖 pom.xml
<dependency>
  <groupId>com.carson_ho</groupId>
  <artifactId>Super_EditText</artifactId>
  <version>1.0.0</version>
  <type>pom</type>
</dependency>

步骤2:设置动画属性

  • 属性说明

示意图

  • 具体属性设置

示意图

  • 使用示例 在XML文件中进行设置 activity_main.xml
<scut.carson_ho.diy_view.SuperEditText
        android:layout_width="200dp"
        android:layout_height="wrap_content"
        // 设置左侧图标
        app:ic_left_click="@drawable/ic_left_click"
        app:ic_left_unclick="@drawable/ic_left_unclick"
        app:left_x="0"
        app:left_y="0"
        app:left_width="60"
        app:left_height="60"

        // 设置删除图标
        app:ic_delete="@drawable/delete"
        app:delete_x="0"
        app:delete_y="0"
        app:delete_width="80"
        app:delete_height="80"

        // 设置分割线
        app:lineColor_click="@color/colorfocus"
        app:lineColor_unclick="@color/colorDeafult"
        app:linePosition="1"

        // 设置光标
        app:cursor="@drawable/cursortest"

         />

cursortest.xml

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
    android:shape="rectangle" >

    <solid android:color="@color/colorfocus" />
    <size android:width="1dp" />

</shape>

5. 完整Demo地址

Carson_Ho的Github地址:Super_EditText

效果图

6. 源码解析

具体请看文章Android自定义View:手把手教你做一款简单实用的SuperEditText(一键删除&自定义样式)

7. 开源协议

Super_EditText 遵循 MIT 开源协议

8. 贡献代码

  • 具体请看:贡献代码说明
  • 关于该开源项目的意见 & 建议可在Issue上提出。欢迎 Star !

9. 版本说明

2017-08-14 v1.0.0 :完成一键删除 & 自定义样式

关于作者

superedittext's People

Contributors

carson-ho avatar

Stargazers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

Watchers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

superedittext's Issues

关于两侧icon的上下定位问题

你好!
现在有一种使用场景:允许edittext显示多行文本,即输入时可以换行输入,同时希望右边的删除图标紧贴输入框底线, 此时不指定android:inputType就可以换行,就像这样
default

随之而来的问题是, 现在希望右边的删除图标紧贴输入框底线,该如何实现?
我进行了尝试,将R.drawable.deletelayer-list包起来,并指定gravity

<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
    <item>
        <bitmap android:src="@drawable/delete"
            android:gravity="bottom"/>
    </item>
</layer-list>

并在edittext 的 setDeleteIconVisible(boolean deleteVisible,boolean leftVisible) 方法中给上面的drawable setBounds()来设置宽高,

 private void setDeleteIconVisible(boolean deleteVisible,boolean leftVisible) {
     if (ic_delete != null) {
         ic_delete.setBounds(0, 0, ic_delete.getIntrinsicWidth(), getMeasuredHeight());
     }
     setCompoundDrawables(leftVisible ?  ic_left_click :  ic_left_unclick, null,
             deleteVisible ?  ic_delete: null, null);
     color = leftVisible ? lineColor_click : lineColor_unclick;
     setTextColor(color);
     invalidate();
 }

此时删除图标的确会紧贴底线,但出现了新的问题,就是每输入一个字符,控件高度都在变高,getMeasuredHeight()总是在变大,
即使输入并没有换行。就像这样:
1

然后我就不知道该怎么办了...希望能获得帮助 : )

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.