-
-
Save craigvgw/6900695a95090fc958268b7d435196be to your computer and use it in GitHub Desktop.
Blazor Random Rect
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| <!DOCTYPE html> | |
| <html> | |
| <head> | |
| <meta charset="utf-8" /> | |
| <meta name="viewport" content="width=device-width" /> | |
| <title>web3</title> | |
| <base href="/" /> | |
| <link href="css/bootstrap/bootstrap.min.css" rel="stylesheet" /> | |
| <link href="css/site.css" rel="stylesheet" /> | |
| <script src="https://cdnjs.cloudflare.com/ajax/libs/pixi.js/4.5.1/pixi.min.js"></script> | |
| <script type="text/javascript"> | |
| const app = new PIXI.Application({width: 256, height: 256});; | |
| const graphics = new PIXI.Graphics(); | |
| window.CreatePIXI = (params) => { | |
| console.log("test app") | |
| document.getElementById('mypixi').appendChild(app.view); | |
| console.log(app) | |
| } | |
| window.DrawRect = (params) => { | |
| graphics.clear(); | |
| graphics.lineStyle(2, 0xFEEB77, 1); | |
| graphics.beginFill(0x650A5A); | |
| graphics.drawRect(params.x, params.y, 100, 100); | |
| graphics.endFill(); | |
| app.stage.addChild(graphics); | |
| } | |
| </script> | |
| </head> | |
| <body> | |
| <app>Loading...</app> | |
| <script src="_framework/blazor.webassembly.js"></script> | |
| </body> | |
| </html> |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| @page "/" | |
| @inject IJSRuntime JsRuntime; | |
| <h1>Call JavaScript Function Example</h1> | |
| <button type="button" class="btn btn-primary" onclick="@DrawRect"> | |
| DrawRect | |
| </button> | |
| @functions { | |
| private async void DrawRect() | |
| { | |
| Random rnd = new Random(); | |
| int x = rnd.Next(10, 200); | |
| int y = rnd.Next(10, 200); | |
| await JsRuntime.InvokeAsync<object>("DrawRect", new {x = x, y = y}); | |
| } | |
| } |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| @inherits LayoutComponentBase | |
| @inject IJSRuntime JsRuntime; | |
| <div class="sidebar"> | |
| <NavMenu /> | |
| </div> | |
| <div class="main"> | |
| <div class="top-row px-4"> | |
| <a href="http://blazor.net" target="_blank" class="ml-md-auto">About</a> | |
| </div> | |
| <div class="content px-4"> | |
| <div id="mypixi"></div> | |
| @Body | |
| </div> | |
| </div> | |
| @functions { | |
| protected override void OnAfterRender() | |
| { | |
| JsRuntime.InvokeAsync<object>("CreatePIXI",""); | |
| } | |
| } |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment