Giter VIP home page Giter VIP logo

android-materialshadowninepatch's Introduction

Material Shadow 9-Patch

This library provides 9-patch based drop shadow for view elements. Works on API level 14 or later.

Android Arsenal Maven Central


Example on Android 4.0 Example on Android 5.0


Target platforms

  • API level 14 or later

Latest version

  • Version 1.0.0 (September 25, 2018)

Getting started

This library is published on Maven Central. Just add these lines to build.gradle.

dependencies {
    compile 'com.h6ah4i.android.materialshadowninepatch:materialshadowninepatch:1.0.0'
}

Usage

Layout XML

<com.h6ah4i.android.materialshadowninepatch.MaterialShadowContainerView
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    style="@style/ms9_DefaultShadowStyle"
    android:id="@+id/shadow_item_container"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    app:ms9_shadowTranslationZ="2dp"
    app:ms9_shadowElevation="4dp">

    <!-- NOTE 1: only 1 child can be accepted -->
    <!-- NOTE 2: margins are required to draw shadow properly -->
    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginLeft="8dp"
        android:layout_marginTop="8dp"
        android:layout_marginRight="8dp"
        android:layout_marginBottom="8dp"
        android:background="@android:color/white"
        android:text="Inner content view" />

</com.h6ah4i.android.materialshadowninepatch.MaterialShadowContainerView>

Java code

MaterialShadowContainerView shadowView =
        (MaterialShadowContainerView) findViewById(R.id.shadow_item_container);

float density = getResources().getDisplayMetrics().density;

shadowView.setShadowTranslationZ(density * 2.0f); // 2.0 dp
shadowView.setShadowElevation(density * 4.0f); // 4.0 dp

Advanced Usages

<com.h6ah4i.android.materialshadowninepatch.MaterialShadowContainerView
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    style="@style/ms9_DefaultShadowStyle"
    android:id="@+id/shadow_item_container"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    app:ms9_shadowTranslationZ="2dp"
    app:ms9_shadowElevation="4dp"
    app:ms9_useAmbientShadow="true"
    app:ms9_useSpotShadow="true"
    app:ms9_forceUseCompatShadow="true"
    app:ms9_affectsDisplayedPosition="true"
    app:ms9_spotShadowDrawablesList="@array/ms9_spot_shadow_drawables_z18"
    app:ms9_ambientShadowDrawablesList="@array/ms9_ambient_shadow_drawables_z18">

    ...

</com.h6ah4i.android.materialshadowninepatch.MaterialShadowContainerView>
Property name Default Description
ms9_shadowTranslationZ 0dp Compatibility version of android:translationZ
ms9_shadowElevation 0dp Compatibility version of android:elevation
ms9_forceUseCompatShadow false Enforces to use compatibility shadow on Lollipop or later
ms9_affectsDisplayedPosition true Specify whether the shadow position is affected by the target view's position (emulates Lollipop's behavior)
app:ms9_useAmbientShadow true Specify whether to use ambient shadow
app:ms9_useSpotShadow true Specify whether to use spot shadow
ms9_spotShadowDrawablesList @array/ms9_spot_shadow_drawables Specify Spot shadow (Key shadow) 9-patch resources
ms9_ambientShadowDrawablesList @array/ms9_ambient_shadow_drawables Specify Ambient shadow 9-patch resources
Style name
ms9_DefaultShadowStyle([ Z6 or Z9 orZ18 ]) Default style (uses spot & ambient shadow, position affects)
ms9_DefaultShadowStyle([ Z6 or Z9 or Z18 ])CompatOnly Default style with ms9_forceUseCompatShadow="true"
ms9_NoDisplayedPositionAffectShadowStyle([ Z6 or Z9 or Z18 ]) No displayed position affects style
ms9_NoDisplayedPositionAffectShadowStyle([ Z6 or Z9 or Z18 ])CompatOnly No displayed position affects style with ms9_forceUseCompatShadow="true"
ms9_CompositeShadowStyle([ Z6 or Z9 ]) Pre-composite shadow style (less overdraws)
ms9_CompositeShadowStyle([ Z6 or Z9 ])CompatOnly Pre-composite shadow style with ms9_forceUseCompatShadow="true"

NOTE: You can specify Z[6|9|18] suffix for style names. This limits the deepest limit of shadow nine patch resources and it makes resource shrinking (shrinkResources true) work more effectively!

License

This library is licensed under the Apache Software License, Version 2.0.

See LICENSE for full of the license text.

Copyright (C) 2015 Haruki Hasegawa

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.

android-materialshadowninepatch's People

Contributors

h6ah4i 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

android-materialshadowninepatch's Issues

Broken repo?

Hello

I tried to add library repo

In gradle build I added:

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

android {
    . . . 
    dependencies {
        . . . . 
        compile 'com.h6ah4i.android.materialshadowninepatch:materialshadowninepatch:0.6.2'
    }
}

After gradle update got following error:

Error:A problem occurred configuring project ':Android'.
> Artifact 'materialshadowninepatch.jar (com.h6ah4i.android.materialshadowninepatch:materialshadowninepatch:0.6.2)' not found.
  Searched in the following locations:
      https://jitpack.io/com/h6ah4i/android/materialshadowninepatch/materialshadowninepatch/0.6.2/materialshadowninepatch-0.6.2.jar

Also tried versions 0.6.1, 0.6.0 but I've experienced same issue

Question - Supported Shapes

Hi,
This is great lib bro. is this lib support circle shapes and custom shapes? or just rectangle shapes?

ThnQ 👍

Can't add to project

I add below line to dependencies and sync. It show's error.

compile 'com.h6ah4i.android.materialshadowninepatch:materialshadowninepatch:1.0.0'

error :
Information:Gradle tasks [:app:generateDebugSources, :app:generateDebugAndroidTestSources, :app:mockableAndroidJar]
/Users/mehdi08/.gradle/caches/transforms-1/files-1.1/appcompat-v7-27.0.2.aar/a5e461f3cfccca112f65fb535223bc71/res/values/values.xml
Error:(252, 5) error: resource android:attr/fontVariationSettings not found.
Error:(252, 5) error: resource android:attr/ttcIndex not found.
/Users/mehdi08/08_Corp./Tapesh/Tapesh-Android/app/build/intermediates/incremental/mergeDebugResources/merged.dir/values/values.xml
Error:(524) resource android:attr/fontVariationSettings not found.
Error:(524) resource android:attr/ttcIndex not found.
Error:failed linking references.
Error:java.util.concurrent.ExecutionException: java.util.concurrent.ExecutionException: com.android.tools.aapt2.Aapt2Exception: AAPT2 error: check logs for details
Error:java.util.concurrent.ExecutionException: com.android.tools.aapt2.Aapt2Exception: AAPT2 error: check logs for details
Error:com.android.tools.aapt2.Aapt2Exception: AAPT2 error: check logs for details
Error:Execution failed for task ':app:processDebugResources'.

Failed to execute aapt
Information:BUILD FAILED in 4s
Information:9 errors
Information:0 warnings
Information:See complete output in console

Resources$NotFoundException : res/drawable-tvdpi-v4/ms9_spot_shadow_z1.xml

Help me fix this error please

Caused by: android.content.res.Resources$NotFoundException: File res/drawable-tvdpi-v4/ms9_spot_shadow_z1.xml from drawable resource ID #0x7f0200e0 at android.content.res.Resources.loadDrawable(Resources.java:1953) at android.content.res.Resources.getDrawable(Resources.java:660) at com.h6ah4i.android.materialshadowninepatch.MaterialShadowContainerView.getNinePatchDrawableFromResource(MaterialShadowContainerView.java:311) at com.h6ah4i.android.materialshadowninepatch.MaterialShadowContainerView.updateShadowLevelCompat(MaterialShadowContainerView.java:346) at com.h6ah4i.android.materialshadowninepatch.MaterialShadowContainerView.updateShadowLevel(MaterialShadowContainerView.java:401) at com.h6ah4i.android.materialshadowninepatch.MaterialShadowContainerView.<init>(MaterialShadowCon

Shadow only draws if root child view has a background

Is this by design?

I have something like this:

<MaterialShadowContainerView>
   <LinearLayout>
    <View android:background="#ff0000">
    <View android:background="#00ff00">
  </LinearLayout>
</MaterialShadowContainerView>

The shadow does not seem to draw if the LinearLayout does not have a background. If I set one, it works, but also means there's unnecessary overdraw.

Thanks for the very useful library, by the way!

Material Shadows not showing up when created dynamically

I have a vertical linear layout with a couple other vertical linear layouts hosted inside of it. I'm trying to use this code to create a little bit of space between each inner item as well as add a shadow to them, but no matter what I try I can't get shadows to appear when I create an object dynamically

My code is as follows

container.removeAllViews();

for (LinearLayout aLayout : itemsToAdd) {

    MaterialShadowContainerView msv = new MaterialShadowContainerView(getApplicationContext());
    msv.setShadowElevation(dp(6));
    msv.setShadowTranslationZ(dp(2));
    msv.setForceUseCompatShadow(true);

    ViewGroup.MarginLayoutParams p = new ViewGroup.MarginLayoutParams(ViewGroup.LayoutParams.MATCH_PARENT, ViewGroup.LayoutParams.WRAP_CONTENT);
    p.setMargins(dp(6), dp(6), dp(6), dp(45));

    msv.setLayoutParams(p);
    msv.addView(aLayout);
    container.addView(msv);

}

where container is a larger vertical linear layout that all of my smaller items are added to, and aLayout is each individual LinearLayout of an ArrayList collection. Right now I'm assuming there is something I've done wrong with the margins as no matter what I do I can't get them to show up at all. All I ever seem to get is one continuous block of white without a single shadow as shown below

Nothing but White

Is there something wrong with the way I'm doing this, or is there an actual bug with this library?

Question - difference between shadowElevation and shadowTranslationZ?

I've been playing around with the values in my app, and also looked at your source code, but I can't quite figure out what the difference is. I'm assuming shadowElevation is how "high" the shadow should be, e.g., what the elevation is of the material it's cast upon? While shadowTranslationZ is how "high" the item in the container is? I'm not sure – shadowElevation is not used in your sample!
Likewise for how much margin is required - you put 16dp for everything in the examples, but how can we calculate the minimum margin required for each shadow size?

Thank you so much for this library, I hope a short guide in the README would as helpful to others!

Reduce overdraws

Can reduce overdraws when inner view has solid filled content.

related issue: #3

Is it possible to have transparent shadows?

From what I'm reading I think the answer is no, but I want to be sure. I have a SlidingPaneLayout where the left pane has multiple colors in it, but the shadow uses the background color of the parent view and it looks terrible.

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.