web-dev-qa-db-ja.com

プレロリポップのリップル効果を作成する方法

this のようなリップル効果を適用する方法

私は依存関係をapp/build.gradleに入れました

app/build.gradle

dependencies {
    compile 'com.github.traex.rippleeffect:library:1.3'
}

build.gradle

allprojects{
    repositories{
        jcenter()
        maven(url "https://jitpack.io" }

XMLファイル:

<com.andexert.library.RippleView
        Android:id="@+id/rect1"
        Android:layout_width="match_parent"
        Android:layout_height="wrap_content">
  <Button
      Android:id="@+id/enterButton"
      Android:layout_width="match_parent"
      Android:layout_height="wrap_content"
      Android:text="Save your user name" />
 </com.andexert.library.RippleView>

Javaクラスファイル

protected void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    setContentView(R.layout.save_user);
    editText=(EditText) findViewById(R.id.userNameEditText);
    button=(Button) findViewById(R.id.enterButton);

    sharedPreferences=getSharedPreferences(SHARED_NAME_STRING, MODE_PRIVATE);
    String userNameString=sharedPreferences.getString(USER_NAME_STRING, "");

    editText.setText(userNameString);

    button.setOnClickListener(new View.OnClickListener() {

        @Override
        public void onClick(View v) {
            String string=editText.getText().toString();
            Intent intent=new Intent(SaveUser.this, MainActivity.class);
            intent.putExtra("user", string);

            SharedPreferences.Editor editor=sharedPreferences.edit();
            editor.putString(USER_NAME_STRING, string);
            editor.commit();

            startActivity(intent);

        }
    });
}

それは動作しますが、私の問題は、波及効果が完了する前に別のアクティビティが開き、戻るボタンを押すと残りの波紋が完了することです。どうすれば解決できますか?

16
Amrita Stha

このライブラリを試すことができます balysv/material-ripple

あなたのgradleで、この行を追加します:

compile 'com.balysv:material-ripple:1.0.2'

そして、これはそれを行う方法です:

<com.balysv.materialripple.MaterialRippleLayout
Android:id="@+id/ripple"
Android:layout_width="match_parent"
Android:layout_height="wrap_content">

<Button
    Android:layout_width="match_parent"
    Android:layout_height="wrap_content"
    Android:layout_gravity="center"
    Android:text="Button inside a ripple"/>
</com.balysv.materialripple.MaterialRippleLayout>
25
Farouk Touzi

Lollipop(API> 21)の場合、drawable-v21でbtn_ripple_effect.xmlとしてファイルを作成し、以下のコードを配置します

 <?xml version="1.0" encoding="utf-8"?>

    <ripple xmlns:Android="http://schemas.Android.com/apk/res/Android"
        xmlns:tools="http://schemas.Android.com/tools"
        Android:color="?android:colorAccent"
        tools:targetApi="Lollipop">
        <item Android:drawable="@color/cancel_btn_clr" /> <!-- default -->
        <item Android:id="@Android:id/mask">
            <shape Android:shape="rectangle">
                <solid Android:color="?android:colorAccent" />
            </shape>
        </item>
    </ripple>

事前Lollipop(API <21)の場合、Drawableフォルダーにbtn_ripple_effect.xmlとしてファイルを作成し、以下のコードを配置します

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:Android="http://schemas.Android.com/apk/res/Android">
    <item Android:state_pressed="true">
        <shape>
            <solid Android:color="@color/colorAccent"></solid>
        </shape>
    </item>

    <item>
        <shape>
            <solid Android:color="@color/cancel_btn_clr"></solid>
        </shape>
    </item>
</selector>

以下のボタンを作成

<Button
                    Android:id="@+id/button3"
                    style="@style/cancel_btn_style"
                    Android:layout_marginLeft="50dp"
                    Android:text="Cancel"
                    />

これをstyle.xmlに追加します

          <style name="cancel_btn_style" parent="Theme.AppCompat">
<item name="Android:textSize">15sp</item>
<item name="Android:textColor">#ffffff</item>
<item name="Android:layout_height">36dp</item>
<item name="Android:layout_width">90dp</item>
<item name="Android:background">@drawable/btn_ripple_effect</item>
30
user5439728

Lollipop(API> 21)の場合、drawable-v21でbtn_ripple_effect.xmlとしてファイルを作成し、以下のコードを配置します

<?xml version="1.0" encoding="utf-8"?>
<ripple xmlns:Android="http://schemas.Android.com/apk/res/Android"
    xmlns:tools="http://schemas.Android.com/tools"
    Android:color="#f8c7c9c8"
    tools:targetApi="Lollipop">

    <item Android:id="@Android:id/mask">

        <shape Android:shape="oval">
            <corners Android:radius="@dimen/dp10" />
            <solid Android:color="#f8ced6d2" />

        </shape>
    </item>
</ripple>

事前Lollipop(API <21)の場合、Drawableフォルダーにbtn_ripple_effect.xmlとしてファイルを作成し、以下のコードを配置します

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

    <item Android:state_pressed="true">
        <shape Android:shape="oval">
            <solid Android:color="#f8ced6d2"/>
        </shape>
    </item>

    <item>
        <shape>
            <solid Android:color="@color/transparent"/>
        </shape>
    </item>
</selector>

このようなimageviewでそれを使用してください

<ImageView
  Android:id="@+id/imageViewOffer"
  Android:layout_width="wrap_content"
  Android:layout_height="wrap_content"
  Android:layout_centerVertical="true"
  Android:background="@drawable/btn_ripple_effect"
  Android:src="@mipmap/ic_offers"/>
5
Neelu Agrawal

これは古いことは知っていますが、ライブラリが提供するonRippleCompleteListenerでアクションを実行できます。何かのようなもの :

rippleView.setOnRippleCompleteListener(new RippleView.OnRippleCompleteListener() {

@Override
public void onComplete(RippleView rippleView) {
//Your code here...
}
});

お役に立てれば。 :)

3
Varun Ramani

Appcompatライブラリを使用する

com.Android.support:appcompat-v7:22.1.1

「Base.TextAppearance.AppCompat.Button」を拡張します

<style name="BrowseContentButton" parent="Base.TextAppearance.AppCompat.Button">
    <item name="Android:textColor">@color/grey_0</item>
    <item name="Android:layout_width">match_parent</item>
    <item name="Android:layout_height">48dp</item>
</style>

スタイルを適用する

 <Button
        Android:id="@+id/browseMultimedia"
        style="@style/BrowseContentButton"
        Android:layout_below="@id/browseGuidelines"
        Android:layout_toRightOf="@+id/divider"
        Android:text="@string/browse_multimedia"
        />
2
rahulrv