2016-04-13 18:26:31 +02:00
<!DOCTYPE html>
2017-08-18 16:26:17 +02:00
< meta charset = "utf-8" >
2017-08-18 16:43:08 +02:00
< meta property = "og:image" itemprop = "image primaryImageOfPage" content = "https://hajimehoshi.github.io/ebiten/images/examples/masking.png" >
< meta name = "description" content = "Ebiten example - masking" >
2016-04-13 18:26:31 +02:00
< link rel = "shortcut icon" href = "../favicon.png" type = "image/png" >
< link rel = "icon" href = "../favicon.png" type = "image/png" >
< title > Ebiten example - masking< / title >
2017-08-18 16:26:17 +02:00
2016-08-27 17:48:15 +02:00
< link rel = "stylesheet" href = "../stylesheets/bootstrap.min.css" >
< link rel = "stylesheet" href = "../stylesheets/highlight-github.css" >
< link rel = "stylesheet" href = "../stylesheets/ebiten.css" >
2016-09-02 18:55:07 +02:00
< script src = "../scripts/googleanalytics.js" > < / script >
2016-08-26 19:28:57 +02:00
2017-08-17 20:00:05 +02:00
< nav class = "navbar" > < div class = "container" >
2017-08-17 18:22:19 +02:00
< nav class = "d-flex flex-row" style = "width: 100%;" >
2017-08-17 20:00:05 +02:00
< div class = "nav mr-auto" > < a class = "navbar-brand" href = "../" > < img src = "../images/logo_white.svg" alt = "EBITEN" > < / a > < / div >
2017-08-17 18:22:19 +02:00
< ul class = "nav" >
< li class = "nav-item" > < a class = "nav-link" href = "https://github.com/hajimehoshi/ebiten" > GitHub< / a > < / li >
< li class = "nav-item" > < a class = "nav-link" href = "https://godoc.org/github.com/hajimehoshi/ebiten" > GoDoc< / a > < / li >
< li class = "nav-item" > < a class = "nav-link" href = "https://github.com/hajimehoshi/ebiten/wiki" > Wiki< / a >
2017-11-09 18:07:16 +01:00
< li class = "nav-item" > < a class = "nav-link" href = "https://ebiten-playground.github.io/" > Playground< / a >
2016-08-26 19:37:08 +02:00
< / ul >
< / nav >
2017-08-17 20:00:05 +02:00
< / div > < / nav >
2016-04-13 18:26:31 +02:00
2016-08-26 19:28:57 +02:00
< main > < div class = "container" >
2016-08-26 20:18:16 +02:00
< h2 > Ebiten example - masking< / h2 >
2016-08-26 19:28:57 +02:00
< iframe src = "masking.content.html" width = "640" height = "480" > < / iframe >
2018-03-21 06:34:48 +01:00
< div class = "card" > < pre class = "card-body" > < code class = "language-go" > // + build example jsgo
2016-08-26 16:33:36 +02:00
package main
2016-04-13 18:26:31 +02:00
import (
2018-03-21 06:34:48 +01:00
" bytes"
2016-08-26 22:36:52 +02:00
" image"
" image/color"
_ " image/jpeg"
" log"
" math"
" github.com/hajimehoshi/ebiten"
2018-03-21 06:34:48 +01:00
" github.com/hajimehoshi/ebiten/examples/resources/images"
2016-04-13 18:26:31 +02:00
)
const (
2016-08-26 22:36:52 +02:00
screenWidth = 320
screenHeight = 240
2016-04-13 18:26:31 +02:00
)
var (
2018-01-29 15:39:30 +01:00
bgImage *ebiten.Image
fgImage *ebiten.Image
maskedFgImage *ebiten.Image
2016-08-26 22:36:52 +02:00
spotLightImage *ebiten.Image
spotLightX = 0
spotLightY = 0
spotLightVX = 1
spotLightVY = 1
2016-04-13 18:26:31 +02:00
)
2018-01-29 15:39:30 +01:00
func init() {
2018-03-21 06:34:48 +01:00
// Decode image from a byte slice instead of a file so that
// this example works in any working directory.
// If you want to use a file, there are some options:
// 1) Use os.Open and pass the file to the image decoder.
// This is a very regular way, but doesn' t work on browsers.
// 2) Use ebitenutil.OpenFile and pass the file to the image decoder.
// This works even on browsers.
// 3) Use ebitenutil.NewImageFromFile to create an ebiten.Image directly from a file.
// This also works on browsers.
img, _, err := image.Decode(bytes.NewReader(images.Gophers_jpg))
2018-01-29 15:39:30 +01:00
if err != nil {
log.Fatal(err)
}
2018-03-21 06:34:48 +01:00
bgImage, _ = ebiten.NewImageFromImage(img, ebiten.FilterDefault)
2018-01-29 15:39:30 +01:00
2018-03-21 06:34:48 +01:00
img, _, err = image.Decode(bytes.NewReader(images.FiveYears_jpg))
2018-01-29 15:39:30 +01:00
if err != nil {
log.Fatal(err)
}
2018-03-21 06:34:48 +01:00
fgImage, _ = ebiten.NewImageFromImage(img, ebiten.FilterDefault)
2018-01-29 15:39:30 +01:00
2018-02-13 18:59:22 +01:00
maskedFgImage, _ = ebiten.NewImage(screenWidth, screenHeight, ebiten.FilterDefault)
2018-01-29 15:39:30 +01:00
// Initialize the spot light image.
const r = 64
alphas := image.Point{r * 2, r * 2}
a := image.NewAlpha(image.Rectangle{image.ZP, alphas})
for j := 0; j < alphas.Y; j+ + {
for i := 0; i < alphas.X; i+ + {
// d is the distance between (i, j) and the (circle) center.
d := math.Sqrt(float64((i-r)*(i-r) + (j-r)*(j-r)))
// Alphas around the center are 0 and values outside of the circle are 0xff.
b := uint8(max(0, min(0xff, int(3*d*0xff/r)-2*0xff)))
a.SetAlpha(i, j, color.Alpha{b})
}
}
2018-02-13 18:59:22 +01:00
spotLightImage, _ = ebiten.NewImageFromImage(a, ebiten.FilterDefault)
2018-01-29 15:39:30 +01:00
}
2016-04-13 18:26:31 +02:00
func update(screen *ebiten.Image) error {
2016-08-26 22:36:52 +02:00
spotLightX + = spotLightVX
spotLightY + = spotLightVY
if spotLightX < 0 {
spotLightX = -spotLightX
spotLightVX = -spotLightVX
}
if spotLightY < 0 {
spotLightY = -spotLightY
spotLightVY = -spotLightVY
}
w, h := spotLightImage.Size()
maxX, maxY := screenWidth-w, screenHeight-h
if maxX < spotLightX {
spotLightX = -spotLightX + 2*maxX
spotLightVX = -spotLightVX
}
if maxY < spotLightY {
spotLightY = -spotLightY + 2*maxY
spotLightVY = -spotLightVY
}
2018-01-29 15:39:30 +01:00
2017-05-16 03:38:34 +02:00
if ebiten.IsRunningSlowly() {
return nil
}
2016-08-26 22:36:52 +02:00
2018-01-29 15:39:30 +01:00
// Reset the maskedFgImage.
maskedFgImage.Fill(color.White)
2016-08-26 22:36:52 +02:00
op := & ebiten.DrawImageOptions{}
2018-01-29 15:39:30 +01:00
op.CompositeMode = ebiten.CompositeModeCopy
2016-08-26 22:36:52 +02:00
op.GeoM.Translate(float64(spotLightX), float64(spotLightY))
2018-01-29 15:39:30 +01:00
maskedFgImage.DrawImage(spotLightImage, op)
// Use ' source-in' composite mode so that the source image (fgImage) is used but the alpha
// is determined by the destination image (maskedFgImage).
//
// The result image is the source image with the destination alpha. In maskedFgImage, alpha
// values in the hole is 0 and alpha values in other places are 0xff. As a result, the
// maskedFgImage draws the source image with a hole that shape is spotLightImage. Note that
// RGB values in the destination image are ignored.
//
// See also https://www.w3.org/TR/compositing-1/#porterduffcompositingoperators_srcin.
2016-08-26 22:36:52 +02:00
op = & ebiten.DrawImageOptions{}
2018-01-29 15:39:30 +01:00
op.CompositeMode = ebiten.CompositeModeSourceIn
maskedFgImage.DrawImage(fgImage, op)
2016-08-26 22:36:52 +02:00
2017-03-04 15:27:25 +01:00
screen.Fill(color.RGBA{0x00, 0x00, 0x80, 0xff})
2018-01-29 15:39:30 +01:00
screen.DrawImage(bgImage, & ebiten.DrawImageOptions{})
screen.DrawImage(maskedFgImage, & ebiten.DrawImageOptions{})
2016-08-26 22:36:52 +02:00
return nil
2016-04-13 18:26:31 +02:00
}
func max(a, b int) int {
2016-08-26 22:36:52 +02:00
if a < b {
return b
}
return a
2016-04-13 18:26:31 +02:00
}
func min(a, b int) int {
2016-08-26 22:36:52 +02:00
if a < b {
return a
}
return b
2016-04-13 18:26:31 +02:00
}
func main() {
2016-08-26 22:36:52 +02:00
if err := ebiten.Run(update, screenWidth, screenHeight, 2, " Masking (Ebiten Demo)" ); err != nil {
log.Fatal(err)
}
2016-04-13 18:26:31 +02:00
}
2017-08-18 16:26:17 +02:00
< / code > < / pre > < / div >
2016-04-13 18:26:31 +02:00
2016-08-26 19:28:57 +02:00
< / div > < / main >
< footer > < div class = "container" >
< p > © 2013 Hajime Hoshi< / p >
2016-08-28 00:10:41 +02:00
< p > Code is licensed under < a href = "https://github.com/hajimehoshi/ebiten/blob/master/LICENSE" > the Apache License 2.0< / a > .< / p >
2016-08-26 19:28:57 +02:00
< p > The content of this page is licensed under < a href = "https://creativecommons.org/licenses/by/4.0/" > the Creative Commons Attribution 4.0 License< / a > .< / p >
< / div > < / footer >
2016-04-13 18:26:31 +02:00
2016-08-27 17:48:15 +02:00
< script src = "../scripts/highlight.pack.js" > < / script >
2016-08-27 07:00:06 +02:00
< script > hljs . initHighlightingOnLoad ( ) ; < / script >
