Giter Site home page Giter Site logo

skittles's Introduction

#Skittles Android Arsenal

A simple,clean api for adding PushBullet style skittles to your app for more material design glory.This library uses the FloatingActionButton provided in the android design support library

##Guide (Sample)

First some housekeeping code:

Use SkittleLayout as a root view in your layouts

<snow.skittles.SkittleLayout 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:id="@+id/skittleLayout"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fitsSystemWindows="true"
app:mainSkittleColor="@color/material_deep_teal_500"
app:mainSkittleIcon="@drawable/ic_android_white_18dp"
tools:context=".MainActivity">

<android.support.design.widget.AppBarLayout
android:id="@+id/appbar"
android:layout_width="match_parent"
android:layout_height="@dimen/appBarMaxHeight"
android:fitsSystemWindows="true"
android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar">
...

</snow.skittles.SkittleLayout>

Some further housekeeping...

Declare a SkittleBuilder,used to add skittles and pass the root SkittleLayout to it

SkittleLayout skittleLayout = (SkittleLayout) findViewById(R.id.skittleLayout);
SkittleBuilder skittleBuilder = new SkittleBuilder(this, skittleLayout, false, R.color.material_deep_purple_500, R.color.material_deep_teal_500);

Now for the fun part

Add skittles to your activity/fragment

skittleBuilder.addSkittle(R.drawable.lannister_icon, R.color.lannister);
skittleBuilder.addSkittle(R.drawable.barratheon_icon, R.color.barratheon);
skittleBuilder.addSkittle(R.drawable.stark_icon, R.color.stark);

A bit more work for adding Text Skittle

TextSkittle textSkittle = skittleBuilder.makeTextSkittle
(R.drawable.lannister_icon, getResources().getString(R.string.house_lannister), R.color.lannister);
textSkittle.setTextBackgroundColor(R.color.textBackground);
textSkittle.setTextColor(android.R.color.black);
skittleBuilder.addTextSkittle(textSkittle);

Flexible callback for clicks:

  • Add a click listener(SkittleBuilder.SkittleClickListener) to the SkittleBuilder object skittleBuilder.setSkittleListener(this);

  • This exposes two methods for Skittle and TextSkittle click events for convenience

void onSkittleClick(Skittle skittle);

void onTextSkittleClick(TextSkittle textSkittle);

Use skittle.getPosition() which return the position of the clicked skittle starting from 1 and starting from bottom

public void onSkittleClick(Skittle skittle) {

  switch (skittle.getPosition()) {
    case 1:
    Toast.makeText(this, "Skittle 1", Toast.LENGTH_LONG).show();
    break;
    case 2:
    Toast.makeText(this, "Skittle 2", Toast.LENGTH_LONG).show();
    break;
  }

}

Similarly for Text Skittle

public void onTextSkittleClick(TextSkittle textSkittle) {

  switch (textSkittle.getPosition()) {
    case 1:
    Toast.makeText(this, "Skittle 1", Toast.LENGTH_LONG).show();
    break;
    case 2:
    Toast.makeText(this, "Skittle 2", Toast.LENGTH_LONG).show();
    break;
  }
}

##Gradle

dependencies{
compile 'com.rlj.library:skittles:0.0.1-beta'
}

See the Sample and JavaDoc for further guidance

##Sample Screenshots

##Upcoming

  • Better support for animations
  • Option for adding skittles by xml (inspired by Navigation View)
  • Test on more devices
  • Upload to Maven Central

Currently in heavy dev, good enough for playing around

#Taste the rainbow ![Skittles](art/Taste the rainbow.jpg)

skittles's People

Contributors

aashrai avatar

Watchers

Michael jentsch avatar James Cloos avatar  avatar

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.