Android仿京东搜索框渐变效果

在许多APP中，有的搜索框是一直固定的，有的呢，附加了很多的效果，就比如京东

好吧，谁让京东那么厉害呢，不说了，开始高仿!

原理:就是自定义scrollview实现对滑动高度的监听,而已

如此实现对搜索框的渐变

先贴上我的自定义scrollview

//自定义ScrollView
public class CustomView extends ScrollView {

  public interface ScrollViewListener {
    void onScrollChanged(CustomView customView, int x, int y, int oldx, int oldy);
  }

  private ScrollViewListener scrollViewListener = null;

  public CustomView(Context context) {
    super(context);
  }

  public CustomView(Context context, AttributeSet attrs,
           int defStyle) {
    super(context, attrs, defStyle);
  }

  public CustomView(Context context, AttributeSet attrs) {
    super(context, attrs);
  }

  public void setScrollViewListener(ScrollViewListener scrollViewListener) {
    this.scrollViewListener = scrollViewListener;
  }

  @Override
  protected void onScrollChanged(int x, int y, int oldx, int oldy) {
    super.onScrollChanged(x, y, oldx, oldy);
    if (scrollViewListener != null) {
      scrollViewListener.onScrollChanged(this, x, y, oldx, oldy);
    }
  }
}

好了，接下来就直接在逻辑代码中调用就行了！

 @Override
  public void onViewCreated(View view, @Nullable Bundle savedInstanceState) {
    super.onViewCreated(view, savedInstanceState);
    //搜索框在布局最上面
    line.bringToFront();
    mScrollview.setScrollViewListener(new CustomView.ScrollViewListener() {
      @Override
      public void onScrollChanged(CustomView customView, int x, int y, int oldx, int oldy) {
        if (y <= 0) {
          line.setBackgroundColor(Color.argb((int) 0, 227, 29, 26));//AGB由相关工具获得，或者美工提供
        } else if (y > 0 && y <= imageHeight) {
          //获取ScrollView向下滑动图片消失的比例
          float scale = (float) y / imageHeight;
          //更加这个比例,让标题颜色由浅入深
          float alpha = (255 * scale);
          // 只是layout背景透明
          line.setBackgroundColor(Color.argb((int) alpha, 255, 255, 255));
        }
      }
    });

以上就是本文的全部内容，希望对大家的学习有所帮助，也希望大家多多支持我们。

赞 (0)

相关推荐

  • Android搜索框组件SearchView的基本使用方法

    Android搜索框组件SearchView的基本使用方法

    SearchView是android系统中内置的一个搜索框组件,可以很方便在添加在用户界面之上,但是也带来了一些问题,那就是searchview的UI是固定的,定制起来会很麻烦,如果对SearchView的要求比较高,完全可以采用button和EditText自己实现.这里先简单的说说SearchView的使用: main.xml: <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" x

  • Android SearchView搜索框组件的使用方法

    Android SearchView搜索框组件的使用方法

    SearchView是搜索框组件,它可以让用户在文本框里输入文字,通过监听器取得用户的输入,当用户点击搜索时,监听器执行实际的搜索. 本文就为大家分享了SearchView搜索框组件的使用方法,供大家参考,具体内容如下 效果: 代码SearchActivity.java package com.jialianjia.bzw.activity; import android.os.Bundle; import android.widget.ArrayAdapter; import android.

  • Android EditText搜索框实现图标居中

    Android EditText搜索框实现图标居中

    类似这样EditText 搜索框,hiht 提示有一个icon并且text内容. 重写EditText : package mobi.truekey.weapp2.widget; import android.content.Context; import android.content.res.TypedArray; import android.graphics.Canvas; import android.graphics.Paint; import android.graphics.dr

  • Android 根据EditText搜索框ListView动态显示数据

    Android 根据EditText搜索框ListView动态显示数据

    根据EditText搜索框ListView动态显示数据是根据需求来的,觉得这之中涉及的东西可能比较的有意思,所以动手来写一写,希望对大家有点帮助. 首先,我们来分析下整个过程: 1.建立一个layout,包含一个EditText搜索框和一个ListView 2.创建一个数据集mData,用于ListView的Adapter的创建 3.添加EditText的文本改变的监听器 4.利用notifyDataSetChanged()动态更新ListView 第一步:创建一个搜索框 这个还是比较容易的,这

  • Android搜索框SearchView属性和用法详解

    Android搜索框SearchView属性和用法详解

    SearchView简介 SearchView是Android原生的搜索框控件,它提供了一个用户界面,用于用户搜索查询. SearchView默认是展示一个search的icon,点击icon展开搜索框,如果你想让搜索框默认就展开,可以通过setIconifiedByDefault(false);实现. SearchView属性 SearchView使用 xml中定义SearchView: <?xml version="1.0" encoding="utf-8"

  • android顶部(toolbar)搜索框实现代码

    android顶部(toolbar)搜索框实现代码

    APP中经常会使用到搜索功能,那我们的搜索框该如何布局呢?下面咱们就看一下下面这个效果: xml布局: <?xml version="1.0" encoding="utf-8"?> <android.support.design.widget.CoordinatorLayout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:app="h

  • Android自定义View实现搜索框（SearchView）功能

    Android自定义View实现搜索框（SearchView）功能

    概述 在Android开发中,当系统数据项比较多时,常常会在app添加搜索功能,方便用户能快速获得需要的数据.搜索栏对于我们并不陌生,在许多app都能见到它,比如豌豆荚 在某些情况下,我们希望我们的自动补全信息可以不只是纯文本,还可以像豌豆荚这样,能显示相应的图片和其他数据信息,因此Android给我们提供的AutoCompleteTextView往往就不够用,在大多情况下我们都需要自己去实现搜索框. 分析 根据上面这张图,简单分析一下自定义搜索框的结构与功能,有 1. 搜索界面大致由三部门组成

  • Android搜索框（SearchView）的功能和用法详解

    SearchView是搜索框组件,它可以让用户在文本框里输入文字,通过监听器取得用户的输入,当用户点击搜索时,监听器执行实际的搜索. 1.SearchView组件的常用方法如下: ①setIconifiedByDefault(boolean iconified) ===> 设置搜索框默认是否自动缩小为图标. ②setOnQueryTextListener(SearchView,OnQueryTextListener listener) ===> 为搜索框设置监听器 ③setSubmitButt

  • Android顶部(toolbar)搜索框实现的实例详解

    Android顶部(toolbar)搜索框实现的实例详解

    Android顶部(toolbar)搜索框实现的实例详解 本文介绍两种SearchView的使用情况,一种是输入框和搜索结果不在一个activity中,另一种是在一个activity中. 首先编写toolbar的布局文件 toolbar中图标在menu文件下定义一个布局文件实现 示例代码: <menu xmlns:android="http://schemas.android.com/apk/res/android" xmlns:app="http://schemas.

  • Android搜索框通用版

    Android搜索框通用版

    之前项目总会遇到很多搜索框类的功能,虽然不是很复杂,不过每次都要去自己处理数据,并且去处理搜索框的变化,写起来也比较麻烦,今天来做一个比较简单的通用搜索栏. 先看下效果图: 没什么特别的,只是今天要做的就是简单的把搜索框的内容封装一下. 一.分析功能 先考虑一下,搜索框一般都是由一个搜索图标(一般都是一个放大镜),一个输入框和一个清除按钮组成.然后会通过监听输入框的变化去处理清除按钮的显示和隐藏并且去过滤相关的数据.最后去刷新适配器,显示过滤后的数据.基本上搜索框的功能都大同小异. 有了上边的分

随机推荐