Ripple Effect Duration in Android XML - android

I am Learning Material Design. I tried ripple effect on button using this gradle
dependencies {
compile 'com.github.traex.rippleeffect:library:1.3'
}
from this https://github.com/traex/RippleEffect link
there are many attribute which are not working
such as
app:rv_rippleDuration="1200"
app:rv_color="#d3d3d3"
I have event on button and ripple effect but when I click on button method is get called. What I want is first ripple effect should get complete then action should occur.
XML code
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical"
android:layout_marginLeft="10dp"
android:layout_marginRight="10dp">
<com.andexert.library.RippleView
android:id="#+id/ripple1"
android:layout_width="match_parent"
android:layout_height="match_parent"
rv_centered="true"
app:rv_rippleDuration="1800"
app:rv_color="#000000">
<Button
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="New Button"
android:id="#+id/fromDateButton" />
</com.andexert.library.RippleView>
</LinearLayout>
user cannot experience animation.

You need to add xmlns:app="http://schemas.android.com/apk/res-auto" as an xmlns in your RippleView before using the app resource.

Problem in the example on the page of description in GitHab.
Change
rv_centered="true"
to
app:rv_centered="true"
and all will be done.
All attribute of ReppleView must contain app:

Related

How to achieve glow effect on focused icon in Android?

I want to show a similar glow like on this image
I know how to get dominant color using Palette. I was wondering how to show a glow effect like this.
I did a similar couple of days ago using a Third-party library. Follow initial steps by adding dependency and maven from here.
below is the xml code of the Glowing button.
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:orientation="vertical"
android:gravity="center"
android:background="#color/black"
android:layout_height="match_parent"
tools:context=".MainActivity">
<com.smb.glowbutton.GlowButton
android:id="#+id/myGlowButton"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginHorizontal="16dp"
android:layout_marginTop="8dp"
app:gb_drawablePadding="50dp"
app:gb_drawableTint="#color/black"
android:paddingTop="5dp"
android:paddingBottom="5dp"
app:gb_text="Prime Video"
app:gb_textColor="#color/white"
app:gb_textSize="16dp"
app:gb_backgroundColor="#305B7B"
app:gb_cornerRadius="15dp"
app:gb_disabledTextColor="#808080"
app:gb_glowAnimationDuration="500"
app:gb_glowColor="#305B7B"
app:gb_rippleAnimationDuration="1500"
app:gb_rippleColor="#305B7B"
app:gb_rippleEnabled="true" />
</LinearLayout>
Output
Hope it would help you.

Material Search Bar isn't showing in the layout preview

Good Morning
Just want to ask why the layout of my Material Search bar now showing in the layout here is my code
<RelativeLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context=".ProductView">
<com.mancj.materialsearchbar.MaterialSearchBar
style="#style/MaterialSearchBarDark"
app:mt_speechMode="true"
app:mt_hint="Custom hint"
app:mt_maxSuggestionsCount="10"
android:layout_width="match_parent"
android:layout_height="50dp"
android:id="#+id/searchBar" />
</RelativeLayout>
Here are the screenshots of what the layout looks like:
Its because the third party library used element which is may not present in your project.
In your case it should be constraintlayout
I just added
implementation 'androidx.constraintlayout:constraintlayout:1.1.2'
and the view is visible for me. But its not necessary for your project if you are not using it in other areas.

Overdraw issue in fragment layout with both background color and theme existing

Hi I am a newbie to Android Programming using AS. This should be a common/easy problem but I have not found a solution so far.
I was creating left_ and right_fragments tags in activity_main.xml for tablets, in which I wanted to have a background color in right_fragment(temporarily set to #ffffff and keep left_fragment as default). Then the Android Lint warned that I got an Overdraw: Painting regions more than once on the right_fragment:
I tried to create a new theme:
<style name="NoBgTheme" parent="android:Theme.Material.Light.DarkActionBar">
<item name="android:windowBackground">#null</item>
</style>
and added android:theme="#style/NoBgTheme" to right_fragment.xml, but it did not work.
Screenshot of this app w/ Debug GPU Overdraw enabled.
If I change android:theme= from "#style/AppTheme" to "#style/NoBgTheme" in AndroidManifest.xml, it worked, but all other layouts lost their backgrounds.
Any idea how to fix this OVERDRAW? Thx in advance.
activity_main.xml:
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:baselineAligned="false"
android:orientation="horizontal">
<fragment
android:id="#+id/left_fragment"
android:name="jerryc05.fragmenttest.LeftFragment"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="1" />
<fragment
android:id="#+id/right_fragment"
android:name="jerryc05.fragmenttest.RightFragment"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="1" />
</LinearLayout>
left_fragment.xml is so simple that we can just ignore it.
right_fragment.xml:
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:theme="#style/NoBgTheme"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
android:background="#ffffff">
<TextView
android:id="#+id/button"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_horizontal"
android:text="This is right fragment"
android:textSize="20sp"
tools:ignore="HardcodedText" />
</LinearLayout>
AndroidManifest.xml remains unchanged.
MainActivity.java remains unchanged.
A little bit of overdraw will happen. You need to set the nobgtheme to your main activity if you want to fix the overdraw on your left fragment and right fragment display. If this only happens during tablet layouts you can check to see if this is a tablet layout being used and set the no background theme at runtime using methods described here: How to change current Theme at runtime in Android
Alright, I got an alternative solution.
I added android:theme="#style/NoBgTheme" after <activity android:name=".MainActivity" before >.
Then I manually specified android:background="#f0f0f0" and android:background="#ffffff" to left_ and right_fragment.xml respectively.
It worked so well!!!
But the Android Lint Warning still exists...(is this a bug or still my fault?)

ForegroundTint "overrides" backgroundTint on button?

I'm working on android app and I need a button with both background and foreground, which are some icons.
I want to set backgroundTint and foregroundTint to different colors, because it will be needed when I write the selectors for colors.
The problem is that when I set foregroundTint:
foregroundTintMode=multiply - background tint is ok, but foreground icon is not changing it's color
foregroundTintMode!=multiply - foreground tint is ok, but background icon is changing it's color to foregroundTint, not backgroundTint
I've tried all of the combinations for foregroundTintMode and backgroundTintMode, but got no results.
Here is my test file:
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context="euroicc.testfb.MainActivity"
android:background="#color/colorPrimary">
<Button
android:id="#+id/button"
android:layout_width="200dp"
android:layout_height="200dp"
android:background="#drawable/icon_background"
android:backgroundTint="#android:color/holo_blue_dark"
android:foreground="#drawable/icon_settings"
android:foregroundTint="#android:color/white"
tools:layout_editor_absoluteX="105dp"
tools:layout_editor_absoluteY="141dp" />
</RelativeLayout>
Note: I was initially working with API lvl 17, but changed to 21. I would like for this app to support as many devices as possible.
Not sure why you are using a normal Button and foreground, use an ImageButton instead:
<ImageButton
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/icon_settings"
android:tint="#android:color/red"
android:background="#drawable/icon_background"
android:backgroundTint="#android:color/black"
/>

Menu that appears from the bottom on button click Android

I am learning Android these days, and I am having some trouble implementing something. When I click on the image icon, I want a menu to appear from below. The screenshot is as below. (Sorry it's in chinese....)
There's awesome library on github to get your task done.
All you need to do is setup your layout in two part as describe in below code
part 1: Your main activity(main frame)
part 2: bottom Panel which will be shown when user swipe/click on button.
You must check how to set "anchor point true" in library document.
<com.sothree.slidinguppanel.SlidingUpPanelLayout xmlns:sothree="http://schemas.android.com/apk/res-auto"
android:id="#+id/bottom_panel"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:gravity="bottom"
sothree:umanoDragView="#+id/dragView"
sothree:umanoPanelHeight="68dp"
sothree:umanoParalaxOffset="10dp">
<FrameLayout
android:id="#+id/content_frame"
android:layout_width="match_parent"
android:layout_height="match_parent">
</FrameLayout>
<RelativeLayout
android:id="#+id/panel"
android:layout_width="match_parent"
android:layout_height="match_parent">
<!--This is bottom layout.-->
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#00FF00"
android:orientation="vertical">
<Button
android:layout_width="match_parent"
android:layout_height="100dp"
android:background="#0000FF"
android:text="Button 1" />
<Button
android:layout_width="match_parent"
android:layout_height="100dp"
android:background="#0000FF"
android:text="Button 1" />
<Button
android:layout_width="match_parent"
android:layout_height="100dp"
android:background="#0000FF"
android:text="Button 1" />
</LinearLayout>
</RelativeLayout>
</com.sothree.slidinguppanel.SlidingUpPanelLayout>
I think what you are trying to do here is to replicate the action sheet of iOS in android. There is this library which does exactly what you are looking for, https://github.com/baoyongzhang/android-ActionSheet . You can either have it as it as it is provided by author or you can clone it and suit your need accordingly. I would prefer if you could clone it as a module in your app that way you have limitless way to re-design it. If you need help on that let us know
You can simply follow the below link , it will implement what u need :
http://trickyandroid.com/fragments-translate-animation/
This will be done through Transition Fragment Animation .

Categories

Resources