memartel_loc/Blazor_Canvas
1
0
Fork 0
Code

Added some more color!

Browse Source
This commit is contained in:
MarcEricMartel 2023-11-11 18:51:59 -05:00
parent ef98f9b494
commit 4b18317d35
1 changed files with 20 additions and 18 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

36
BlazorCanvas/BlazorCanvas/Pages/Index.razor
View File

@ -8,33 +8,38 @@
@inject IJSRuntime jsRuntime
<header>
<h3>On dessine en gang!</h3>
<label>Color: </label>
<select @bind="@currentcolor">
<option value="Black" selected>Black</option>
<option value="Red">Red</option>
<option value="Blue">Blue</option>
<option value="Green">Green</option>
<option value="Yellow">Yellow</option>
<option value="DarkRed">Dark Red</option>
<option value="Gray">Gray</option>
</select>
@* <input type="radio" name="color" checked="@(this.currentcolor == "Black")" onchange="@(() => this.currentcolor = "Black")" /><label>Black</label>
<input type="radio" name="color" checked="@(this.currentcolor == "Red")" onchange="@(() => this.currentcolor = "Red")"/><label>Red</label>
<input type="radio" name="color" checked="@(this.currentcolor == "Green")" onchange="@(() => this.currentcolor = "Green")" /><label>Green</label>
<input type="radio" name="color" checked="@(this.currentcolor == "Gray")" onchange="@(() => this.currentcolor = "Gray")" /><label>Gray</label> *@
<label>Point Size: </label>
<select @bind="@pointsize">
<option value="1" selected>1</option>
<option value="2">2</option>
<option value="3">3</option>
<option value="4">4</option>
</select>
</header>
<div @ref="divCanvas" @onmousemove="OnMouseMove">
<div @ref="divCanvas" @onmousemove="OnMouseMove" style="border:1px solid #000000;">
<BECanvas @ref="myCanvas" Height="1080" Width="1920"></BECanvas>
</div>
<h3>CanvasDrawing</h3>
@code {
ElementReference divCanvas;
BECanvasComponent myCanvas;
Canvas2DContext currentCanvasContext;
BECanvasComponent myCanvas = new();
Canvas2DContext? currentCanvasContext;
private string currentcolor { get; set; }// = "Black";
private string currentcolor { get; set; } = "Black";
private int pointsize { get; set; } = 1;
async void OnMouseMove(MouseEventArgs eventArgs)
{
async void OnMouseMove(MouseEventArgs eventArgs) {
double mouseX = 0, mouseY = 0;
if (eventArgs.Buttons == 0)
@ -49,14 +54,11 @@
mouseX = eventArgs.ClientX - offsets.Value<double>("offsetLeft");
mouseY = eventArgs.ClientY - offsets.Value<double>("offsetTop");
}
if (currentCanvasContext is null)
currentCanvasContext = await myCanvas.CreateCanvas2DAsync();
//await currentCanvasContext.ClearRectAsync(0, 0, 800, 800);
await currentCanvasContext.SetFillStyleAsync(currentcolor);
await currentCanvasContext.FillRectAsync(mouseX, mouseY, 1, 1);
//await currentCanvasContext.StrokeTextAsync("ClientX: " + mouseX +
// " Client Y: " + mouseY, 20, 20);
await currentCanvasContext.FillRectAsync(mouseX, mouseY, pointsize, pointsize);
}
}