Example usage for com.google.gwt.canvas.dom.client Context2d createLinearGradient

List of usage examples for com.google.gwt.canvas.dom.client Context2d createLinearGradient

Introduction

In this page you can find the example usage for com.google.gwt.canvas.dom.client Context2d createLinearGradient.

Prototype

public final native CanvasGradient createLinearGradient(double x0, double y0, double x1, double y1) ;

Source Link

Document

Creates a linear gradient.

Usage

From source file:com.philbeaudoin.quebec.client.scene.Rectangle.java

License:Apache License

@Override
public void drawUntransformed(double time, Context2d context) {
    CanvasGradient gradient = context.createLinearGradient(x0, y0, x0, y1);
    gradient.addColorStop(0, color0);//from   w  w  w  . j  a v a2s.c o m
    gradient.addColorStop(1, color1);
    context.setFillStyle(gradient);
    context.fillRect(x0, y0, w, h);
    if (strokeColor != null && strokeWidth > 0) {
        context.setStrokeStyle(strokeColor);
        context.setLineWidth(strokeWidth);
        context.strokeRect(ox0, oy0, ow, oh);
    }
}

From source file:nl.mpi.tg.eg.experiment.client.view.ColourPickerCanvasView.java

License:Open Source License

private void sizeAndPaintCanvases(final int canvasHeight, final int canvasWidth, final int barWidth) {
    this.canvasHeight = canvasHeight;
    this.canvasWidth = canvasWidth;
    mainCanvas.setCoordinateSpaceHeight(canvasHeight);
    mainCanvas.setCoordinateSpaceWidth(canvasWidth);
    mainCanvas.setSize(canvasWidth + "px", canvasHeight + "px");
    hueCanvas.setCoordinateSpaceHeight(canvasHeight);
    hueCanvas.setCoordinateSpaceWidth(barWidth);
    hueCanvas.setSize(barWidth + "px", canvasHeight + "px");
    final Context2d hueContext2d = hueCanvas.getContext2d();

    CanvasGradient hueGradient = hueContext2d.createLinearGradient(0, 0, 0, canvasHeight);
    for (double stop = 0; stop <= 10; stop += 0.005) {
        hueGradient.addColorStop(stop * 0.1f, "hsl(" + 36 * stop + ",100%,50%)");
    }//from   ww  w .  j  a  v a 2s . c  om
    hueContext2d.setFillStyle(hueGradient);
    hueContext2d.fillRect(0, 0, barWidth, canvasHeight);
}

From source file:nl.mpi.tg.eg.experiment.client.view.ColourPickerCanvasView.java

License:Open Source License

synchronized private void setHue(String colourCss) {
    currentHueCss = colourCss;//from w ww  .  j  a  v a  2  s .  c  o m
    // " Android clearRect / fillRect bug" ???
    // GWT documentation: JavaScript interpreters are single-threaded, so while GWT silently accepts the synchronized keyword, it has no real effect.
    // So we are using a simple boolean which should be adequate most of the time. We could use a timer call back, but we want to keep this simple.
    // However the browser is probably only single threaded anyway.
    if (hueChangeInProgress) {
        return;
    }
    hueChangeInProgress = true;
    final Context2d mainContext2dA = mainCanvas.getContext2d();
    CanvasGradient linearColour = mainContext2dA.createLinearGradient(0, 0, canvasWidth, 0);
    linearColour.addColorStop(1f, "white");
    linearColour.addColorStop(0f, colourCss);
    mainContext2dA.setFillStyle(linearColour);
    mainContext2dA.fillRect(0, 0, canvasWidth, canvasHeight);

    // todo: remove the second context get if it proves unhelpful witht the samsung 4.2.2 issue
    final Context2d mainContext2dB = mainCanvas.getContext2d();
    CanvasGradient linearGrey = mainContext2dB.createLinearGradient(0, 0, 0, canvasHeight);
    linearGrey.addColorStop(1f, "black");
    linearGrey.addColorStop(0f, "rgba(0,0,0,0)");
    mainContext2dB.setFillStyle(linearGrey);
    mainContext2dB.fillRect(0, 0, canvasWidth, canvasHeight);
    hueChangeInProgress = false;
}

From source file:nl.ru.languageininteraction.synaesthesia.client.view.ColourPickerCanvasView.java

License:Open Source License

private void sizeAndPaintCanvases(final int canvasHeight, final int canvasWidth, final int barWidth) {
    this.canvasHeight = canvasHeight;
    this.canvasWidth = canvasWidth;
    mainCanvas.setCoordinateSpaceHeight(canvasHeight);
    mainCanvas.setCoordinateSpaceWidth(canvasWidth);
    mainCanvas.setSize(canvasWidth + "px", canvasHeight + "px");
    hueCanvas.setCoordinateSpaceHeight(canvasHeight);
    hueCanvas.setCoordinateSpaceWidth(barWidth);
    hueCanvas.setSize(barWidth + "px", canvasHeight + "px");
    final Context2d hueContext2d = hueCanvas.getContext2d();

    CanvasGradient hueGradient = hueContext2d.createLinearGradient(0, 0, 0, canvasHeight);
    for (int stop = 0; stop <= 10; stop++) {
        hueGradient.addColorStop(stop * 0.1f, "hsl(" + 36 * stop + ",100%,50%);");
    }//from  w w w.  j a v a  2s. c om
    hueContext2d.setFillStyle(hueGradient);
    hueContext2d.fillRect(0, 0, barWidth, canvasHeight);
}

From source file:nl.ru.languageininteraction.synaesthesia.client.view.ColourPickerCanvasView.java

License:Open Source License

synchronized private void setHue(String colourCss) {
    currentHueCss = colourCss;/*from   w ww  .  ja v  a 2  s . co m*/
    // " Android clearRect / fillRect bug" ???
    // GWT documentation: JavaScript interpreters are single-threaded, so while GWT silently accepts the synchronized keyword, it has no real effect.
    // So we are using a simple boolean which should be adequate most of the time. We could use a timer call back, but we want to keep this simple.
    // However the browser is probably only single threaded anyway.
    if (hueChangeInProgress) {
        return;
    }
    hueChangeInProgress = true;
    final Context2d mainContext2dA = mainCanvas.getContext2d();
    CanvasGradient linearColour = mainContext2dA.createLinearGradient(0, 0, canvasWidth, 0);
    linearColour.addColorStop(1f, "white");
    linearColour.addColorStop(0f, colourCss);
    mainContext2dA.setFillStyle(linearColour);
    mainContext2dA.fillRect(0, 0, canvasWidth, canvasHeight);

    // todo: remove the second context get if it proves unhelpful witht the samsung 4.2.2 issue
    final Context2d mainContext2dB = mainCanvas.getContext2d();
    CanvasGradient linearGrey = mainContext2dB.createLinearGradient(0, 0, 0, canvasHeight);
    linearGrey.addColorStop(1f, "black");
    linearGrey.addColorStop(0f, "rgba(0,0,0,0);");
    mainContext2dB.setFillStyle(linearGrey);
    mainContext2dB.fillRect(0, 0, canvasWidth, canvasHeight);
    hueChangeInProgress = false;
}

From source file:org.cruxframework.crux.widgets.client.colorpicker.SaturationLightnessPicker.java

License:Apache License

private void drawGradient(boolean drawHandle) {
    Context2d ctx = canvas.getContext2d();

    // draw gradient
    for (int x = 0; x <= 179; x++) {
        CanvasGradient grad = ctx.createLinearGradient(x, 0, x, 179);
        int s = Math.round(x * 100 / 179);
        String hex = ColorUtils.hsl2hex(hue, s, 0);
        grad.addColorStop(0, "#" + hex);
        hex = ColorUtils.hsl2hex(hue, s, 100);
        grad.addColorStop(1, "#" + hex);
        ctx.setFillStyle(grad);/* w  w  w. j  a  va  2s. c  o  m*/
        ctx.fillRect(x, 0, 1, 180);
    }

    // draw handle
    if (drawHandle) {
        ctx.beginPath();
        ctx.arc(handleX, handleY, 3, 0, Math.PI * 2, false);
        ctx.closePath();
        ctx.setFillStyle("#ffffff");
        ctx.fill();

        ctx.beginPath();
        ctx.arc(handleX, handleY, 2, 0, Math.PI * 2, false);
        ctx.closePath();
        ctx.setFillStyle("#000000");
        ctx.fill();
    }
}

From source file:stroom.widget.htree.client.ShadowBox.java

License:Apache License

private void drawBackground(final Context2d ctx, final Bounds bounds, final Colors colors) {
    FillStrokeStyle fill = null;/*from ww w .j  a  v  a2s .  com*/
    if (colors.backgroundTopColor.equals(colors.backgroundBottomColor)) {
        fill = CssColor.make(colors.backgroundTopColor);
    } else {
        final CanvasGradient gradient = ctx.createLinearGradient(bounds.getX(), bounds.getY(), bounds.getX(),
                bounds.getMaxY());
        gradient.addColorStop(0, colors.backgroundTopColor);
        gradient.addColorStop(1, colors.backgroundBottomColor);
        fill = gradient;
    }

    CssColor stroke = null;
    stroke = CssColor.make(colors.borderColor);

    roundedRectangle.draw(ctx, bounds.getX(), bounds.getY(), bounds.getWidth(), bounds.getHeight(), radius,
            fill, stroke);
}