Een van de bepalende kenmerken van materiaalontwerp is het gebruik van kleur om inhoud op het scherm te complimenteren en te benadrukken. De ... gebruiken Palet
klasse kunnen ontwikkelaars opvallende kleuren uit een bitmap halen voor gebruik in hun apps om elementen van de gebruikersinterface aan te passen.
In dit artikel leert u hoe u een maakt Palet
object van een bitmap. Bevat in elk Palet
is een verzameling van Swatch
objecten waarmee u kunt werken met specifieke kleurprofielen en een lijst met zichtbare kleuren uit de afbeelding.
Als u aan de slag wilt gaan, moet u de paletondersteuningsbibliotheek in uw project importeren door de volgende regel op te nemen in het gebied afhankelijkheden van de projectvereisten van uw project. build.gradle het dossier. Aangezien dit een v7-ondersteuningsbibliotheek is, is de Palet
gerelateerde klassen zijn beschikbaar terug naar Android API 7.
compileer 'com.android.support:palette-v7:+'
Na het uitvoeren van een graden synchronisatie voor uw project kunt u een genereren Palet
van een bitmap. Dit kan gedaan worden met behulp van de Palette.Builder
een van beide synchroon door het te bellen genereren ()
methode zonder parameters, of asynchroon door te bellen genereren (Palette.PaletteAsyncListener luisteraar)
. Omdat het enige tijd kan duren om het te maken Palet
, het wordt aanbevolen dat de synchrone methode alleen wordt aangeroepen vanuit een achtergrondthread. In aanvulling op de twee methoden genereren, de Palette.Builder
klas heeft een aantal andere handige methoden die komen met hun eigen compromissen:
maximumColorCount (int numOfSwatches)
kunt u het aantal wijzigen Swatch
objecten moeten worden gegenereerd vanuit de bitmap. De standaardinstelling voor de builder is 16. Meer Swatch
objecten die u genereert, hoe langer het duurt om de Palet
.resizeBitmapSize (int maxDimension)
wijzigt de grootte van de bitmap zodat de grootste afmeting ervan slechts zo groot is als de doorgegeven waarde van deze methode. Hoe groter uw bitmap, hoe langer het duurt om een Palet
. Op dezelfde manier zullen kleinere bitmaps sneller worden verwerkt, maar u verliest de kleurprecisie.Het volgende codefragment laat zien hoe u een bitmap maakt van een lokale bron en asynchroon maakt Palet
voorwerp.
Bitmap bitmap = BitmapFactory.decodeResource (getResources (), R.drawable.union_station); Palette.from (bitmap) .generate (nieuw Palette.PaletteAsyncListener () @Override public void onGenerated (Palette-palet) // werk hier met het palet);
Als je eenmaal een hebt Palet
, je kunt beginnen met werken met de bijbehorende Swatch
voorwerpen.
Swatch
objecten vertegenwoordigen kleuren die zijn gegenereerd op basis van het palet van een afbeelding. Elk Swatch
bevat:
Swatch
.Swatch
primaire kleur.Swatch
primaire kleur.Elk Palet
heeft een set van zes voorgedefinieerde kleurprofielen:
Hoewel elk van deze bruikbaar kan zijn, afhankelijk van het ontwerp van uw app, zijn levendige en donkere levendige kleuren het meest gebruikt. Een ding om op te merken is dat een van deze profielen kan zijn nul
, dus je moet deze situatie dienovereenkomstig aan. In het voorbeeldproject, in de onGenerated (paletpalet)
methode van de asynchrone Palette.Builder
, je kunt zien hoe elk profiel te extraheren Swatch
.
setViewSwatch (mVibrantTextView, palette.getVibrantSwatch ()); setViewSwatch (mLightVibrantTextView, palette.getLightVibrantSwatch ()); setViewSwatch (mDarkVibrantTextView, palette.getDarkVibrantSwatch ()); setViewSwatch (mMutedTextView, palette.getMutedSwatch ()); setViewSwatch (mLightMutedTextView, palette.getLightMutedSwatch ()); setViewSwatch (mDarkMutedTextView, palette.getDarkMutedSwatch ());
setViewSwatch (TextView-weergave, Palette.Swatch-staal)
is een methode die a accepteert Swatch
en Tekstweergave
, en stelt de Tekstweergave
achtergrond- en tekstkleuren uit waarden in de Swatch
. U zult merken dat we eerst controleren of het Swatch
is nul
en als dat zo is, verbergen we gewoon het uitzicht.
openbare lege setViewSwatch (TextView-weergave, Palette.Swatch-staal) if (swatch! = null) view.setTextColor (swatch.getTitleTextColor ()); view.setBackgroundColor (swatch.getRgb ()); view.setVisibility (View.VISIBLE); else view.setVisibility (View.GONE);
In aanvulling op het standaardprofiel Swatch
objecten, elk Palet
bevat een lijst met algemeen Swatch
objecten gegenereerd vanuit de bitmap. Deze kunnen worden opgehaald uit de Palet
als een Lijst
door de getSwatches ()
methode.
In het voorbeeldproject Lijst
wordt opgehaald en in een geplaatst ArrayAdapter
die dan de Swatch
primaire kleur en hoofdtekstkleur, evenals het aantal pixels weergegeven in de bitmap hiermee Swatch
. Een ding om op te letten is dat de lijst niet in een bepaalde volgorde staat. In het voorbeeldproject heb ik de items gesorteerd op hun populatie-waarde.
voor (Palette.Swatch swatch: palette.getSwatches ()) mAdapter.add (swatch); mAdapter.sortSwatches (); mAdapter.notifyDataSetChanged ();
In dit codefragment, mAdapter
is de adapter van Swatch
objecten met de volgende methoden:
@Override openbaar View getView (int position, View convertView, ViewGroup parent) ViewHolder holder; if (convertView == null) holder = new ViewHolder (); convertView = LayoutInflater.from (getContext ()) .inflate (R.layout.color_item, parent, false); holder.view = (TextView) convertView.findViewById (R.id.view); convertView.setTag (houder); else holder = (ViewHolder) convertView.getTag (); holder.view.setBackgroundColor (getItem (positie) .getRgb ()); holder.view.setTextColor (getItem (positie) .getBodyTextColor ()); holder.view.setText ("Population:" + getItem (position) .getPopulation ()); return convertView; openbare ongeldige sortSwatches () sort (nieuwe Comparator() @Override openbaar int vergelijken (Palette.Swatch lhs, Palette.Swatch rhs) return rhs.getPopulation () - lhs.getPopulation (); ); public class ViewHolder TextView view;
In dit artikel hebt u geleerd over de Palet
ondersteuningsbibliotheek en hoe u kleurmonsters uit een bitmap kunt extraheren. Hiermee kunt u uw gebruikersinterface-elementen, zoals achtergronden en tekst, aanpassen zodat ze de afbeeldingen in uw app complimenteren. In combinatie met de Kleur
en ColorUtil
klassen (beschikbaar in de ondersteuningsbibliotheek v4), je hebt zelfs meer opties beschikbaar voor de inkleuring van je app.