Skip to content

Commit 224fdfd

Browse files
mizraelmizrael
authored
Merge pull request #17 from Zettersten/feature/resize-canvas
Add's top-level resize function to render context
2 parents 3b017af + 29de54f commit 224fdfd

File tree

68 files changed

+60157
-1
lines changed

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

68 files changed

+60157
-1
lines changed

‎samples/Blazorex.Samples.ResizeCanvas/App.razor‎

Lines changed: 12 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,12 @@
1+
<Router AppAssembly="@typeof(App).Assembly">
2+
<Found Context="routeData">
3+
<RouteView RouteData="@routeData" DefaultLayout="@typeof(MainLayout)" />
4+
<FocusOnNavigate RouteData="@routeData" Selector="h1" />
5+
</Found>
6+
<NotFound>
7+
<PageTitle>Not found</PageTitle>
8+
<LayoutView Layout="@typeof(MainLayout)">
9+
<p role="alert">Sorry, there's nothing at this address.</p>
10+
</LayoutView>
11+
</NotFound>
12+
</Router>

‎samples/Blazorex.Samples.ResizeCanvas/Blazorex.Samples.ResizeCanvas.csproj‎

Lines changed: 19 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,19 @@
1+
<Project Sdk="Microsoft.NET.Sdk.BlazorWebAssembly">
2+
3+
4+
<PropertyGroup>
5+
<TargetFramework>net8.0</TargetFramework>
6+
<Nullable>enable</Nullable>
7+
<ImplicitUsings>enable</ImplicitUsings>
8+
</PropertyGroup>
9+
10+
<ItemGroup>
11+
<PackageReference Include="Microsoft.AspNetCore.Components.WebAssembly" Version="8.0.6" />
12+
<PackageReference Include="Microsoft.AspNetCore.Components.WebAssembly.DevServer" Version="8.0.6" PrivateAssets="all" />
13+
</ItemGroup>
14+
15+
<ItemGroup>
16+
<ProjectReference Include="..\..\src\Blazorex\Blazorex.csproj" />
17+
</ItemGroup>
18+
19+
</Project>

‎samples/Blazorex.Samples.ResizeCanvas/Blazorex.Samples.ResizeCanvas.csproj.user‎

Lines changed: 6 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,6 @@
1+
<?xml version="1.0" encoding="utf-8"?>
2+
<Project ToolsVersion="Current" xmlns="http://schemas.microsoft.com/developer/msbuild/2003">
3+
<PropertyGroup>
4+
<ActiveDebugProfile>https</ActiveDebugProfile>
5+
</PropertyGroup>
6+
</Project>

‎samples/Blazorex.Samples.ResizeCanvas/Layout/MainLayout.razor‎

Lines changed: 8 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,8 @@
1+
@inherits LayoutComponentBase
2+
<div class="page">
3+
<main>
4+
<article class="content px-4">
5+
@Body
6+
</article>
7+
</main>
8+
</div>

‎samples/Blazorex.Samples.ResizeCanvas/Layout/MainLayout.razor.css‎

Lines changed: 77 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,77 @@
1+
.page {
2+
position: relative;
3+
display: flex;
4+
flex-direction: column;
5+
}
6+
7+
main {
8+
flex: 1;
9+
}
10+
11+
.sidebar {
12+
background-image: linear-gradient(180deg, rgb(5, 39, 103) 0%, #3a0647 70%);
13+
}
14+
15+
.top-row {
16+
background-color: #f7f7f7;
17+
border-bottom: 1px solid #d6d5d5;
18+
justify-content: flex-end;
19+
height: 3.5rem;
20+
display: flex;
21+
align-items: center;
22+
}
23+
24+
.top-row ::deep a, .top-row ::deep .btn-link {
25+
white-space: nowrap;
26+
margin-left: 1.5rem;
27+
text-decoration: none;
28+
}
29+
30+
.top-row ::deep a:hover, .top-row ::deep .btn-link:hover {
31+
text-decoration: underline;
32+
}
33+
34+
.top-row ::deep a:first-child {
35+
overflow: hidden;
36+
text-overflow: ellipsis;
37+
}
38+
39+
@media (max-width: 640.98px) {
40+
.top-row {
41+
justify-content: space-between;
42+
}
43+
44+
.top-row ::deep a, .top-row ::deep .btn-link {
45+
margin-left: 0;
46+
}
47+
}
48+
49+
@media (min-width: 641px) {
50+
.page {
51+
flex-direction: row;
52+
}
53+
54+
.sidebar {
55+
width: 250px;
56+
height: 100vh;
57+
position: sticky;
58+
top: 0;
59+
}
60+
61+
.top-row {
62+
position: sticky;
63+
top: 0;
64+
z-index: 1;
65+
}
66+
67+
.top-row.auth ::deep a:first-child {
68+
flex: 1;
69+
text-align: right;
70+
width: 0;
71+
}
72+
73+
.top-row, article {
74+
padding-left: 2rem !important;
75+
padding-right: 1.5rem !important;
76+
}
77+
}

‎samples/Blazorex.Samples.ResizeCanvas/Pages/Home.razor‎

Lines changed: 120 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,120 @@
1+
@page "/"
2+
3+
<PageTitle>Home</PageTitle>
4+
5+
<img @ref="_spritesheet" hidden src="blazor.png" />
6+
7+
<CanvasManager @ref="_canvasManager" />
8+
9+
<button class="btn btn-primary" @onclick="Resize">Resize</button>
10+
11+
@code
12+
{
13+
CanvasManager _canvasManager;
14+
15+
ElementReference _spritesheet;
16+
IRenderContext _context;
17+
18+
int _width = 800;
19+
int _height = 600;
20+
21+
float _x = 400;
22+
float _y = 300;
23+
24+
float _dx = 1;
25+
float _dy = 1;
26+
float _spriteSpeed = 0.25f;
27+
float _spriteMaxSpeed = 5f;
28+
29+
int _spriteWidth = 200;
30+
int _spriteHeight = 200;
31+
32+
float _lastUpdate = 0;
33+
float _elapsedTime = 0;
34+
35+
protected override async Task OnAfterRenderAsync(bool firstRender)
36+
{
37+
if (!firstRender)
38+
return;
39+
40+
_canvasManager.CreateCanvas("main", new CanvasCreationOptions()
41+
{
42+
Hidden = false,
43+
Width = _width,
44+
Height = _height,
45+
OnCanvasReady = this.OnMainCanvasReady,
46+
OnFrameReady = this.OnMainFrameReady,
47+
OnResize = this.OnMainCanvasResize,
48+
});
49+
}
50+
51+
private void OnMainCanvasReady(CanvasBase canvas)
52+
{
53+
_context = canvas.RenderContext;
54+
}
55+
56+
private void OnMainFrameReady(float timestamp)
57+
{
58+
this.Update(timestamp);
59+
this.Render();
60+
}
61+
62+
private void OnMainCanvasResize(Size windowSize)
63+
{
64+
65+
}
66+
67+
private void Resize()
68+
{
69+
var sizePresents = new List<(int width, int height)>
70+
{
71+
(1920, 1080),
72+
(1080, 1920),
73+
(800, 600),
74+
(600, 800),
75+
(400, 300),
76+
(300, 400),
77+
};
78+
79+
var getRandomSize = () => sizePresents[Random.Shared.Next(sizePresents.Count)];
80+
81+
var (width, height) = getRandomSize();
82+
83+
_width = width;
84+
_height = height;
85+
_context.Resize(_width, _height);
86+
}
87+
88+
private void Update(float timeStamp)
89+
{
90+
_elapsedTime = timeStamp - _lastUpdate;
91+
_lastUpdate = timeStamp;
92+
93+
if (_x + _spriteWidth >= _width || _x < 0)
94+
_dx = -_dx;
95+
96+
if (_y + _spriteHeight >= _height || _y < 0)
97+
_dy = -_dy;
98+
99+
var speed = Math.Clamp(_spriteSpeed * _elapsedTime, 0, _spriteMaxSpeed);
100+
_x += _dx * speed;
101+
_y += _dy * speed;
102+
}
103+
104+
private void Render()
105+
{
106+
_context.ClearRect(0, 0, _width, _height);
107+
108+
// fills the background with a dark blue color
109+
_context.FillStyle = "rgb(0, 0, 100)";
110+
_context.FillRect(0, 0, _width, _height);
111+
112+
// draws a yellow border around the sprite
113+
_context.StrokeStyle = "rgb(255, 255,0)";
114+
_context.LineWidth = 3;
115+
_context.StrokeRect(_x, _y, _spriteWidth, _spriteHeight);
116+
117+
// draws the sprite
118+
_context.DrawImage(_spritesheet, _x, _y, _spriteWidth, _spriteHeight);
119+
}
120+
}

‎samples/Blazorex.Samples.ResizeCanvas/Program.cs‎

Lines changed: 11 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,11 @@
1+
using Blazorex.Samples.ResizeCanvas;
2+
using Microsoft.AspNetCore.Components.Web;
3+
using Microsoft.AspNetCore.Components.WebAssembly.Hosting;
4+
5+
var builder = WebAssemblyHostBuilder.CreateDefault(args);
6+
builder.RootComponents.Add<App>("#app");
7+
builder.RootComponents.Add<HeadOutlet>("head::after");
8+
9+
builder.Services.AddScoped(sp => new HttpClient { BaseAddress = new Uri(builder.HostEnvironment.BaseAddress) });
10+
11+
await builder.Build().RunAsync();

‎samples/Blazorex.Samples.ResizeCanvas/Properties/launchSettings.json‎

Lines changed: 23 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,23 @@
1+
{
2+
"$schema": "https://json.schemastore.org/launchsettings.json",
3+
"profiles": {
4+
"http": {
5+
"commandName": "Project",
6+
"dotnetRunMessages": true,
7+
"launchBrowser": true,
8+
"applicationUrl": "http://localhost:5078",
9+
"environmentVariables": {
10+
"ASPNETCORE_ENVIRONMENT": "Development"
11+
}
12+
},
13+
"https": {
14+
"commandName": "Project",
15+
"dotnetRunMessages": true,
16+
"launchBrowser": true,
17+
"applicationUrl": "https://localhost:7028;http://localhost:5078",
18+
"environmentVariables": {
19+
"ASPNETCORE_ENVIRONMENT": "Development"
20+
}
21+
}
22+
}
23+
}

‎samples/Blazorex.Samples.ResizeCanvas/_Imports.razor‎

Lines changed: 12 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,12 @@
1+
@using System.Net.Http
2+
@using System.Net.Http.Json
3+
@using Microsoft.AspNetCore.Components.Forms
4+
@using Microsoft.AspNetCore.Components.Routing
5+
@using Microsoft.AspNetCore.Components.Web
6+
@using Microsoft.AspNetCore.Components.Web.Virtualization
7+
@using Microsoft.AspNetCore.Components.WebAssembly.Http
8+
@using Microsoft.JSInterop
9+
@using Blazorex.Samples.ResizeCanvas
10+
@using Blazorex.Samples.ResizeCanvas.Layout
11+
@using Blazorex
12+

‎samples/Blazorex.Samples.ResizeCanvas/appsettings.Development.json‎

Lines changed: 8 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,8 @@
1+
{
2+
"Logging": {
3+
"LogLevel": {
4+
"Default": "Information",
5+
"Microsoft.AspNetCore": "Warning"
6+
}
7+
}
8+
}

0 commit comments

Comments
 (0)