Code Monkey home page Code Monkey logo

multiwaveheader's Introduction

多重水波纹 - MultiWaveHeader

License JCenter MinSdk Platform Author

English | 中文

MultiWaveHeader 是一个可以高度定制每个波形的Android水波控件。

功能特点

  • 支持调节进度.
  • 支持调节速度.
  • 支持设置方向(上下).
  • 支持设置水波的数量(无上限).
  • 支持精确定义水波的参数(偏移、拉伸、原始速度).
  • 支持设置颜色渐变和改变渐变方向.

演示

Download APK-Demo

每天领红包

最近开通了支付宝商家,生成了个红包二维码,经常用支付宝的童鞋可有扫码领优惠红包,扫码只会拿红包,不会有任何损失,每天都可以扫码哦!

支付宝红包

实战

控制台

方向

顶部 底部
一对 单一

简单用例

1.在 build.gradle 中添加依赖

    implementation 'com.scwang.wave:MultiWaveHeader:1.0.0'

    //androidx
    implementation 'com.scwang.wave:MultiWaveHeader:1.0.0-andx'

2.在XML布局文件中添加 MultiWaveHeader

    <com.scwang.wave.MultiWaveHeader
        android:id="@+id/waveHeader"
        android:layout_width="match_parent"
        android:layout_height="200dp"/>

属性

可以配置一些基本的属性.

java
    MultiWaveHeader waveHeader = findViewById(R.id.waveHeader);

    waveHeader.setStartColor(R.color.colorPrimary);
    waveHeader.setCloseColor(R.color.colorPrimaryDark);
    waveHeader.setColorAlpha(.5f);

    waveHeader.setWaveHeight(50);
    waveHeader.setGradientAngle(360);
    waveHeader.setProgress(.8f);
    waveHeader.setVelocity(1f);
    waveHeader.setScaleY(-1f);

    waveHeader.setWaves("PairWave");

    waveHeader.start();
    waveHeader.stop();
    waveHeader.isRunning();
xml
    <com.scwang.wave.MultiWaveHeader
        android:id="@+id/waveHeader"
        android:layout_width="match_parent"
        android:layout_height="200dp"
        android:scaleY="-1"
        app:mwhVelocity="1"
        app:mwhProgress="1"
        app:mwhRunning="true"
        app:mwhGradientAngle="45"
        app:mwhWaveHeight="50dp"
        app:mwhColorAlpha="0.45"
        app:mwhStartColor="@color/colorPrimaryDark"
        app:mwhCloseColor="@color/colorPrimaryLight"
        app:mwhWaves="MultiWave"/>

自定义

可以高度定制每一条水波.

java
    MultiWaveHeader waveHeader = findViewById(R.id.waveHeader);

    String[] waves = new String[]{
        "70,25,1.4,1.4,-26",//wave-1:offsetX(dp),offsetY(dp),scaleX,scaleY,velocity(dp/s)
        "100,5,1.4,1.2,15",
        "420,0,1.15,1,-10",//wave-3:水平偏移(dp),竖直偏移(dp),水平拉伸,竖直拉伸,速度(dp/s)
        "520,10,1.7,1.5,20",
        "220,0,1,1,-15",
    };
    waveHeader.setWaves(TextUtils.join(" ", Arrays.asList(waves)));// custom
    waveHeader.setWaves("PairWave");// default two waves
    waveHeader.setWaves("MultiWave");// default five waves
xml
    <com.scwang.wave.MultiWaveHeader
        android:id="@+id/waveHeader"
        android:layout_width="match_parent"
        android:layout_height="200dp"
        app:mwhWaves="PairWave"
        app:mwhWaves="MultiWave"
        app:mwhWaves="
            70,25,1.4,1.4,-26
            100,5,1.4,1.2,15
            420,0,1.15,1,-10
            520,10,1.7,1.5,20
            220,0,1,1,-15"/>

其他作品

SmartRefreshLayout
SmartRefreshHorizontal

License

Copyright 2017 scwang90

Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at

   http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.

multiwaveheader's People

Contributors

scwang90 avatar xxjy 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  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

multiwaveheader's Issues

引入库失败

Unable to resolve dependency for ':app@debugAndroidTest/compileClasspath': Could not resolve com.scwang.wave:MultiWaveHeader:1.0.0-alpha-1.

是什么问题呢?

直接打开那个demo apk 也安装不了

When height goes greater than 1, the waveheader starts to go out of screen

hi. first of all thankyou for this amazing library! made my app ui look even more beautiful.
Secondly, I have a small problem. I have a button which sets the progress as waveHeader.setProgress(waveHeader.getProgress()+0.1f) for some clicks. But in this way, when the progress count becomes greater than 1, theheader goes out of screen. And even when the header is onScreen at progress= exact 1, the header would not cover the complete screen, the waves would be still shorter than the top edge of the screen. Is there a way to cover the complete screen?

I also wanted to know if we could somehow make the animation of setProgress() more smooth, because even a small change from 0.5f to 0.6f is very abrupt.

Thanks again for this awesome library!!!

error: failed linking file resources.

error: attribute 'com.eye.tree:mwhRunning' not found.
Message{kind=ERROR, text=error: attribute 'com.eye.tree:mwhRunning' not found., sources=[F:\AndroidProject\Tree\NormalJoy\src\main\res\layout\main_activity_frist.xml:27], original message=, tool name=Optional.of(AAPT)}

<android.support.v7.widget.Toolbar
    android:id="@+id/fri_toolbar"
    android:layout_width="match_parent"
    android:layout_height="?attr/actionBarSize"
    android:background="#009687"
    android:elevation="10dp">
    <!--
    <at.markushi.ui.ActionView
        android:id="@+id/action"
        android:layout_width="56dip"
        android:layout_height="56dip"
        android:padding="16dp"
        app:av_action="drawer"
        app:av_color="@android:color/white" />
    -->

    <com.scwang.wave.MultiWaveHeader
        android:id="@+id/fri_waveHeader"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:layout_marginTop="26dp"
        android:scaleY="-1"
        app:mwhCloseColor="@color/colorPrimaryLight"
        app:mwhColorAlpha="0.45"
        app:mwhGradientAngle="45"
        app:mwhProgress="1"
        app:mwhRunning="true"
        app:mwhStartColor="@color/colorPrimaryDark"
        app:mwhVelocity="1"
        app:mwhWaveHeight="50dp"
        app:mwhWaves="MultiWave" />


</android.support.v7.widget.Toolbar>

<ScrollView
    android:layout_width="match_parent"
    android:layout_height="match_parent">

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:orientation="vertical">

        <ImageView
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:contentDescription="@string/LOADING"
            android:src="@mipmap/query_room_age2" />


    </LinearLayout>
</ScrollView>

but
-->
<com.scwang.wave.MultiWaveHeader
android:id="@+id/fri_waveHeader"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_marginTop="26dp"
android:scaleY="-1"
app:mwhCloseColor="@color/colorPrimaryLight"
app:mwhColorAlpha="0.45"
app:mwhGradientAngle="45"
app:mwhProgress="1"
app:mwhStartColor="@color/colorPrimaryDark"
app:mwhVelocity="1"
app:mwhWaveHeight="50dp"
app:mwhWaves="MultiWave" />

it works,and is mwhRunning, i do not why,

Wave not showing programmatically

Wave header is not showing using java example, but wave work perfectly using XML code.
I use the below java code example From readme
MultiWaveHeader waveHeader = findViewById(R.id.waveHeader);

waveHeader.setStartColor(R.color.colorPrimary);
waveHeader.setCloseColor(R.color.colorPrimaryDark);
waveHeader.setColorAlpha(.5f);

waveHeader.setWaveHeight(50);
waveHeader.setGradientAngle(360);
waveHeader.setProgress(.8f);
waveHeader.setVelocity(1f);
waveHeader.setScaleY(-1f);

waveHeader.setWaves("PairWave");

waveHeader.start();
waveHeader.stop();
waveHeader.isRunning();

水波纹的 波长不可定制吗?

想问一下,水波纹的波长是否不可控制,是写死的控件宽度的两倍. 如果是的话,想问一下,这样设置是处于哪一方面考虑的.谢谢了.

可否在代码写一些注释

以前学自定义控件的时候都是看别人的源码+少部分注释+百度 这样学的,我也想学一下,但源码完全看不懂

可以增加接口改变颜色

public void update() {
    updateLinearGradient(getMeasuredWidth(), getMeasuredHeight());
    invalidate();
}

public void setStartColor(int startColor) {
    mStartColor = startColor;
}

public void setCloseColor(int closeColor) {
    mCloseColor = closeColor;
}

Make a new Release to BinTray; Update Readme.

Even thought the Readme tells to use:

implementation 'com.scwang.wave:MultiWaveHeader:1.0.0-alpha-3'
//androidx
implementation 'com.scwang.wave:MultiWaveHeader:1.0.0-andx-3'

It has not been published. Please publish it and update Readme.

仓库无效问题

implementation 'com.scwang.wave:MultiWaveHeader:1.0.0-alpha-3'

//androidx
implementation 'com.scwang.wave:MultiWaveHeader:1.0.0-andx-3'

都没有
implementation 'com.scwang.wave:MultiWaveHeader:1.0.0-alpha-1' 无奈用回这个

在一些特定条件下的crash

如果嵌套了NestedScrollView,控件的onSizeChange不会第一时间执行,后面的Paint.getShape就空指针。
我复写控件,在onMeasure,调用了所有在onSizeChange调用的函数,修复了改bug

New feature

可以根据重力反馈,自动调节水平面的倾斜度

导入失败

ERROR: Failed to resolve: com.scwang.wave:MultiWaveHeader:1.0.0-alpha-3
Show in Project Structure dialog
Affected Modules: app

Corrections

Change the code for the most current version of Android Studio...

Dependency

implementation 'com.scwang.wave:MultiWaveHeader:1.0.0-alpha-1'

Layout XML is missing the close tag.

<com.scwang.wave.MultiWaveHeader
    android:id="@+id/waveHeader"
    android:layout_width="match_parent"
    android:layout_height="200dp">

</com.scwang.wave.MultiWaveHeader>

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.