Specialeffekter och spelutveckling i Java(TM) - Ett röd-blått gradientexempel

av Anibal Wainstein

7.0.3 Ett röd-blått gradientexempel

En gradient är en skala som visar resultaten när man blandar två färger. Vi skall nu utnyttja MemoryImageSource klassen för att skapa en gradient mellan rött och blått. Det enda vi behöver i den här appleten är en init() metod och en paint() metod. Låt oss först titta på init() metoden samt de globala deklarationerna:

import java.applet.*;
import java.awt.*;
import java.awt.image.*;

public class gradient extends Applet {

//"gradientimage" kommer att hålla reda på
//bilden som vi skapar.
Image gradientimage=null;

public void init()
{
    //Vi måste nu veta appletskärmens storlek.
    Dimension d;
    d=size();

    //Vi börjar med att skapa en array som
    //är lika stor som skärmen. Den kommer
    //att innehålla färgvärdena som vi sedan
    //använder för att skapa en bild.
    int pixels[]=new int[d.width*d.height];
    int red,blue,colorvalue;

    //Följande FOR-slinga sveper igenom
    //bilden från vänster till höger.
    //Den fyller upp arrayen med
    //pixelvärden som blandas mellan
    //rött och blått (rött längst till vänster
    //och blått längst till höger.
    for (int x=0; x<d.width; x++)
    {
        //Räkna ut ett värde på röd- och blå-
        //komponenterna beroende på var
        //positionen på "x" är. ((d.width-x)/d.width)
        //samt (x/d.width) används som faktorer.
        red=(255*(d.width-x))/d.width;
        blue=(255*x)/d.width;

        //Dessa två värden är
        //komponenter för färgvärdet, som vi
        //bygger upp tillsammans med alfa-kanalen
        //(0xff000000). Observera att röd-komponenten
        //måste skiftas 2 bytes åt vänster så att
        //den hamnar på rätt plats. Detta gör vi genom
        //att multiplicera två gånger med 256.
        //Blå-komponenten ÄR redan i rätt plats, så
        //där behöver vi inte multiplicera.
        colorvalue=0xff000000+(red*256*256)+blue;

        //Följande FOR-slinga kommer att
        //svepa igenom bilden upp och ner.
        for (int y=0; y<d.height; y++)
        {
            //Kom ihåg att x+y*d.width är
            //positionen för pixeln som
            //skall sättas eller läsas
            //av.
            pixels[x+y*d.width]=colorvalue;
        }
    }
    //Nu kan vi skapa ett MemoryImageSource-
    //objekt.
    MemoryImageSource imgsrc=
         new MemoryImageSource(d.width,d.height,pixels,0,d.width);

    //Med createImage() skapar vi bilden som
    //man kan använda i paint() metoden.
    gradientimage=createImage(imgsrc);
}

Titta noga på import-uttrycken. Observera att du måste importera java.awt.image paketet för att kunna ha tillgång till MemoryImageSource klassen. I programmet så har vi endast en global variabel, "gradientimage", som används för att lagra resultatet av gradientberäkningen. Detta görs i init() metoden, där vi börjar med att skapa arrayen som skall vara tillräckligt stor för att lagra alla pixlar i appletskärmen. Två FOR-slingor kommer att användas för att svepa igenom pixlarna i arrayen och skapa gradienten. För varje x-värde som den yttersta FOR-slingan går igenom, så sveper den inre FOR-slingan igenom alla y-värden från 0 till "d.height" (höjden på bilden). Beräkningen av blå och röd komponenterna samt färgvärdet, sker i den yttre FOR-slingan. Detta görs för att kunna spara på processorkraft, eftersom alla y-värdena som motsvarar ett x-värde kommer att ha samma färg. Så hur räknar vi ut färgkomponenterna? Vi vet att vi skall ha rött längst till vänster (där x=0) och blått längst till höger (där x=d.width-1). Den procentuella faktorn (x / d.width) kommer att vara noll längst till vänster och 1 längst till höger. Den kan vi multiplicera med 255 och sätta som blå komponent:

blue=(255*x)/d.width;

Kom ihåg att vid heltalsdivision så fick vi göra multiplikationen först och sedan divisionen. För rött kan vi använda faktorn ((d.width-x)/d.width) som är 1 längst till vänster och 0 längst till höger (Kolla det om du är osäker, genom att sätta in ett värde på "x"):

red=(255*(d.width-x))/d.width;

Efter det använder vi uttrycket i förra avsnittet för att bygga upp pixelvärdet. Observera att alfa-kanalen är värdet 0xff000000. Den inre FOR-slingan sätter värdet på pixeln i positionen x och y. Det sista som görs i init() metoden, är skapandet av själva bilden enligt samma recept som jag gav i förra avsnittet. Metoden paint() är inte särskild komplicerad:

ublic void paint(Graphics g)
{
    //Vi måste först kolla att gradientimage
    //inte är NULL innan vi ritar ut den.
    if (gradientimage!=null) g.drawImage(gradientimage,0,0,this);
}

Du behöver inte ha några parametrar för den här appleten och storleken kvittar. Det är bara att skapa en HTML fil och köra den. Vi du se på resultatet, så kan du klicka här.

Visst är det intressant? Resultatet visar ju att mittenpartierna i riksdagen har valt helt felaktiga färger för sina logon!

Nästa sida >>