add pixel-perfect to overlap (#45)

_proofs/overlap/pixel-perfect.md

@@ -0,0 +1,16 @@
+---
+title: Pixel Perfect
+concept: Overlap
+order: 1
+tags: [overlap]
+complexity: 1
+sourcefiles: source/PlayState.hx
+---
+Use {% api flixel.util.FlxCollision.pixelPerfectCheck() %} to check if any of pixels of a {% api flixel.FlxSprite %} overlaps the pixels of another {% api flixel.FlxSprite %}.
+
+{% api flixel.util.FlxCollision.pixelPerfectCheck() %} will return `true` if it detects an overlap, and `false`. if it does not. this is true regardless of the sprite's hitbox, and works for any {% api flixel.FlxSprite.scale %}, {% api flixel.FlxObject.angle %} or even {% api flixel.FlxObject.scrollFactor %}
+
+```haxe
+// overlaps will be true if the two objects are overlapping each other
+overlaps = FlxCollision.pixelPerfectCheck(spriteA, spriteB);
+```

demos/overlap/pixel-perfect/Project.xml

@@ -0,0 +1,24 @@
+<?xml version="1.0" encoding="utf-8"?>
+<project xmlns="http://lime.software/project/1.0.2"
+	xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:schemaLocation="http://lime.software/project/1.0.2 http://lime.software/xsd/project-1.0.2.xsd">
+
+	<app title="pixel-perfect" file="pixel-perfect" main="Main" version="0.0.1" company="HaxeFlixel" />
+	<set name="SWF_VERSION" value="11.8" />
+	<window width="320" height="240" fps="60" hardware="true" vsync="false" />
+	<window if="desktop" orientation="landscape" fullscreen="false" resizable="true" />
+	<window if="mobile" orientation="landscape" fullscreen="true" width="0" height="0" />
+	<window background="null" if="html5" />
+	<set name="BUILD_DIR" value="export" />
+	<source path="source" />
+	<source path="../../shared/" />
+	<assets path="../../demo-assets" rename="assets" />
+	<haxelib name="flixel"/>
+	<!--haxelib name="flixel-addons" /-->
+	<!--haxelib name="flixel-ui"/-->
+	<haxedef name="FLX_NO_MOUSE" />
+	<haxedef name="FLX_NO_KEYBOARD" unless="debug" />
+	<haxedef name="FLX_NO_TOUCH" />
+	<haxedef name="FLX_NO_GAMEPAD" />
+	<haxedef name="FLX_NO_FOCUS_LOST_SCREEN" />
+	<haxedef name="FLX_NO_DEBUG" unless="debug" />
+</project>

demos/overlap/pixel-perfect/source/Main.hx

@@ -0,0 +1,13 @@
+package;
+
+import flixel.FlxSnippet;
+import openfl.display.Sprite;
+
+class Main extends Sprite
+{
+	public function new()
+	{
+		super();
+		addChild(new FlxSnippet(0, 0, PlayState));
+	}
+}

demos/overlap/pixel-perfect/source/PlayState.hx

@@ -0,0 +1,44 @@
+package;
+
+import flixel.FlxG;
+import flixel.FlxSprite;
+import flixel.FlxState;
+import flixel.tweens.FlxEase;
+import flixel.tweens.FlxTween;
+import flixel.util.FlxCollision;
+
+class PlayState extends FlxState
+{
+	var circle:FlxSprite;
+	var box:FlxSprite;
+	var overlaps:Bool;
+
+	override public function create()
+	{
+		bgColor = 0;
+
+		super.create();
+
+		box = new FlxSprite("assets/bigbox.png");
+		box.screenCenter();
+		box.angularVelocity = 180;
+		// tween scale up and down
+		FlxTween.tween(box.scale, {x: 0.5, y: 0.5}, 2 / 3, {type: PINGPONG, ease: FlxEase.sineInOut});
+
+		add(box);
+
+		circle = new FlxSprite("assets/sprite.png");
+		circle.screenCenter();
+		// move right so it only touches at certain angles
+		circle.x += (box.width + circle.width) * 0.55;
+		add(circle);
+	}
+
+	override public function update(elapsed:Float)
+	{
+		final overlaps = FlxCollision.pixelPerfectCheck(circle, box);
+		box.alpha = overlaps ? 0.5 : 1;
+
+		super.update(elapsed);
+	}
+}