Skip to content

Commit 4a3bbea

Browse files
UmaMaheswariChandraboseUmaMaheswariChandrabose
authored
Merge pull request #1 from subaa1492/master
Added blazor tab sample
2 parents 73a30e5 + bfa49c8 commit 4a3bbea

33 files changed

+1496
-2
lines changed

‎App.razor‎

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

‎Blazor Toolbar Video format file.docx‎

18.7 KB
Binary file not shown.

‎BlazorExample.csproj‎

Lines changed: 11 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,11 @@
1+
<Project Sdk="Microsoft.NET.Sdk.Web">
2+
3+
<PropertyGroup>
4+
<TargetFramework>netcoreapp3.1</TargetFramework>
5+
</PropertyGroup>
6+
7+
<ItemGroup>
8+
<PackageReference Include="Syncfusion.Blazor" Version="18.1.0.46" />
9+
</ItemGroup>
10+
11+
</Project>

‎Data/WeatherForecast.cs‎

Lines changed: 15 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,15 @@
1+
using System;
2+
3+
namespace BlazorExample.Data
4+
{
5+
public class WeatherForecast
6+
{
7+
public DateTime Date { get; set; }
8+
9+
public int TemperatureC { get; set; }
10+
11+
public int TemperatureF => 32 + (int)(TemperatureC / 0.5556);
12+
13+
public string Summary { get; set; }
14+
}
15+
}

‎Data/WeatherForecastService.cs‎

Lines changed: 25 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,25 @@
1+
using System;
2+
using System.Linq;
3+
using System.Threading.Tasks;
4+
5+
namespace BlazorExample.Data
6+
{
7+
public class WeatherForecastService
8+
{
9+
private static readonly string[] Summaries = new[]
10+
{
11+
"Freezing", "Bracing", "Chilly", "Cool", "Mild", "Warm", "Balmy", "Hot", "Sweltering", "Scorching"
12+
};
13+
14+
public Task<WeatherForecast[]> GetForecastAsync(DateTime startDate)
15+
{
16+
var rng = new Random();
17+
return Task.FromResult(Enumerable.Range(1, 5).Select(index => new WeatherForecast
18+
{
19+
Date = startDate.AddDays(index),
20+
TemperatureC = rng.Next(-20, 55),
21+
Summary = Summaries[rng.Next(Summaries.Length)]
22+
}).ToArray());
23+
}
24+
}
25+
}

‎Pages/Counter.razor‎

Lines changed: 16 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,16 @@
1+
@page "/counter"
2+
3+
<h1>Counter</h1>
4+
5+
<p>Current count: @currentCount</p>
6+
7+
<button class="btn btn-primary" @onclick="IncrementCount">Click me</button>
8+
9+
@code {
10+
private int currentCount = 0;
11+
12+
private void IncrementCount()
13+
{
14+
currentCount++;
15+
}
16+
}

‎Pages/Error.razor‎

Lines changed: 16 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,16 @@
1+
@page "/error"
2+
3+
4+
<h1 class="text-danger">Error.</h1>
5+
<h2 class="text-danger">An error occurred while processing your request.</h2>
6+
7+
<h3>Development Mode</h3>
8+
<p>
9+
Swapping to <strong>Development</strong> environment will display more detailed information about the error that occurred.
10+
</p>
11+
<p>
12+
<strong>The Development environment shouldn't be enabled for deployed applications.</strong>
13+
It can result in displaying sensitive information from exceptions to end users.
14+
For local debugging, enable the <strong>Development</strong> environment by setting the <strong>ASPNETCORE_ENVIRONMENT</strong> environment variable to <strong>Development</strong>
15+
and restarting the app.
16+
</p>

‎Pages/FetchData.razor‎

Lines changed: 46 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,46 @@
1+
@page "/fetchdata"
2+
3+
@using BlazorExample.Data
4+
@inject WeatherForecastService ForecastService
5+
6+
<h1>Weather forecast</h1>
7+
8+
<p>This component demonstrates fetching data from a service.</p>
9+
10+
@if (forecasts == null)
11+
{
12+
<p><em>Loading...</em></p>
13+
}
14+
else
15+
{
16+
<table class="table">
17+
<thead>
18+
<tr>
19+
<th>Date</th>
20+
<th>Temp. (C)</th>
21+
<th>Temp. (F)</th>
22+
<th>Summary</th>
23+
</tr>
24+
</thead>
25+
<tbody>
26+
@foreach (var forecast in forecasts)
27+
{
28+
<tr>
29+
<td>@forecast.Date.ToShortDateString()</td>
30+
<td>@forecast.TemperatureC</td>
31+
<td>@forecast.TemperatureF</td>
32+
<td>@forecast.Summary</td>
33+
</tr>
34+
}
35+
</tbody>
36+
</table>
37+
}
38+
39+
@code {
40+
private WeatherForecast[] forecasts;
41+
42+
protected override async Task OnInitializedAsync()
43+
{
44+
forecasts = await ForecastService.GetForecastAsync(DateTime.Now);
45+
}
46+
}

‎Pages/Index.razor‎

Lines changed: 132 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,132 @@
1+
@page "/"
2+
3+
<SfTab Width="600" CssClass="tab_content e-fill" HeaderPlacement="@HeaderPosition.Top" OverflowMode="@OverflowMode.Popup">
4+
<TabItems>
5+
<TabItem Content="HyperText Markup Language is the standard markup language used to create web pages.">
6+
<ChildContent>
7+
<TabHeader Text="HTML">
8+
</TabHeader>
9+
</ChildContent>
10+
</TabItem>
11+
<TabItem Content="Java is used in a wide variety of computing platforms from embedded devices and mobile phones to enterprise servers and supercomputers.">
12+
<ChildContent>
13+
<TabHeader Text="Java">
14+
</TabHeader>
15+
</ChildContent>
16+
</TabItem>
17+
<TabItem>
18+
<ChildContent>
19+
<TabHeader Text="JavaScript">
20+
</TabHeader>
21+
</ChildContent>
22+
<ContentTemplate>
23+
<div>JavaScript (JS) is an interpreted computer programming language. It was originally implemented as part of web browsers so that client-side scripts could interact with the user, control the browser, communicate asynchronously, and alter the document content that was displayed.</div>
24+
</ContentTemplate>
25+
</TabItem>
26+
<TabItem Content="The command-line compiler, VBC.EXE, is installed as part of the freeware .NET Framework SDK. Mono also includes a command-line VB.NET compiler. The most recent version is VB 2012, which was released on August 15, 2012.">
27+
<ChildContent>
28+
<TabHeader Text="VB.Net"></TabHeader>
29+
</ChildContent>
30+
</TabItem>
31+
<TabItem Content="Xamarin is a San Francisco, California based software company created in May 2011[3] by the engineers that created Mono,[4] Mono for Android and MonoTouch that are cross-platform implementations of the Common Language Infrastructure (CLI) and Common Language Specifications (often called Microsoft .NET). With a C#-shared codebase, developers can use Xamarin tools to write native Android, iOS, and Windows apps with native user interfaces and share code across multiple platforms.[5] Xamarin has over 1 million developers in more than 120 countries around the World as of May 2015.">
32+
<ChildContent>
33+
<TabHeader Text="Xamarin"></TabHeader>
34+
</ChildContent>
35+
</TabItem>
36+
<TabItem Content="ASP.NET is an open-source server-side web application framework designed for web development to produce dynamic web pages. It was developed by Microsoft to allow programmers to build dynamic web sites, web applications and web services. It was first released in January 2002 with version 1.0 of the .NET Framework, and is the successor to Microsoft's Active Server Pages (ASP) technology. ASP.NET is built on the Common Language Runtime (CLR), allowing programmers to write ASP.NET code using any supported .NET language. The ASP.NET SOAP extension framework allows ASP.NET components to process SOAP messages.">
37+
<ChildContent>
38+
<TabHeader Text="ASP.NET"></TabHeader>
39+
</ChildContent>
40+
</TabItem>
41+
<TabItem Content="The ASP.NET MVC is a web application framework developed by Microsoft, which implements the model–view–controller (MVC) pattern. It is open-source software, apart from the ASP.NET Web Forms component which is proprietary. In the later versions of ASP.NET, ASP.NET MVC, ASP.NET Web API, and ASP.NET Web Pages (a platform using only Razor pages) will merge into a unified MVC 6.The project is called ASP.NET vNext.">
42+
<ChildContent>
43+
<TabHeader Text="ASP.NET MVC"></TabHeader>
44+
</ChildContent>
45+
</TabItem>
46+
<TabItem Content="PHP is a server scripting language, and a powerful tool for making dynamic and interactive Web pages.">
47+
<ChildContent>
48+
<TabHeader Text="PHP">
49+
</TabHeader>
50+
</ChildContent>
51+
</TabItem>
52+
<TabItem Content="Ruby is an interpreted, high-level, general-purpose programming language.It runs on a variety of platforms, such as Windows, Mac OS and UNIX.">
53+
<ChildContent>
54+
<TabHeader Text="Ruby">
55+
</TabHeader>
56+
</ChildContent>
57+
</TabItem>
58+
<TabItem Content="C# is intended to be a simple, modern, general-purpose, object-oriented programming language. Its development team is led by Anders Hejlsberg. The most recent version is C# 5.0, which was released on August 15, 2012.">
59+
<ChildContent>
60+
<TabHeader Text="C Sharp(C#)"></TabHeader>
61+
</ChildContent>
62+
</TabItem>
63+
<TabItem Content="Python was designed with an emphasis on code readability, and its syntax allows programmers to express their concepts in fewer lines of code.">
64+
<ChildContent>
65+
<TabHeader Text="Python">
66+
</TabHeader>
67+
</ChildContent>
68+
</TabItem>
69+
<TabItem Content="Perl is a general purpose, high level interpreted and dynamic programming language. Perl supports both the procedural and Object-Oriented programming.">
70+
<ChildContent>
71+
<TabHeader Text="Perl">
72+
</TabHeader>
73+
</ChildContent>
74+
</TabItem>
75+
<TabItem Content="SQL gives you the ability to find necessary information fast and in a reliable way.">
76+
<ChildContent>
77+
<TabHeader Text="SQL">
78+
</TabHeader>
79+
</ChildContent>
80+
</TabItem>
81+
</TabItems>
82+
</SfTab>
83+
84+
@*Code snippet for two-way binding*@
85+
86+
@*<SfNumericTextBox TValue="double" Min="0" Max="4" Width="200px"
87+
@bind-Value="@ChangedValue">
88+
</SfNumericTextBox>
89+
<br />
90+
<br />
91+
<SfTab CssClass="tab_content e-fill" @bind-SelectedItem="@ChangedValue">
92+
<TabItems>
93+
<TabItem Content="HyperText Markup Language is the standard markup language used to create web pages.">
94+
<ChildContent>
95+
<TabHeader Text="HTML">
96+
</TabHeader>
97+
</ChildContent>
98+
</TabItem>
99+
<TabItem Content="Java is used in a wide variety of computing platforms from embedded devices and mobile phones to enterprise servers and supercomputers.">
100+
<ChildContent>
101+
<TabHeader Text="Java">
102+
</TabHeader>
103+
</ChildContent>
104+
</TabItem>
105+
<TabItem>
106+
<ChildContent>
107+
<TabHeader Text="JavaScript">
108+
</TabHeader>
109+
</ChildContent>
110+
<ContentTemplate>
111+
<div>JavaScript (JS) is an interpreted computer programming language. It was originally implemented as part of web browsers so that client-side scripts could interact with the user, control the browser, communicate asynchronously, and alter the document content that was displayed.</div>
112+
</ContentTemplate>
113+
</TabItem>
114+
<TabItem Content="The command-line compiler, VBC.EXE, is installed as part of the freeware .NET Framework SDK. Mono also includes a command-line VB.NET compiler. The most recent version is VB 2012, which was released on August 15, 2012.">
115+
<ChildContent>
116+
<TabHeader Text="VB.Net"></TabHeader>
117+
</ChildContent>
118+
</TabItem>
119+
</TabItems>
120+
</SfTab>
121+
122+
@code {
123+
public double ChangedValue = 0;
124+
}*@
125+
126+
<style>
127+
.tab_content .e-content .e-item {
128+
font-size: 12px;
129+
padding: 10px;
130+
text-align: justify;
131+
}
132+
</style>

‎Pages/_Host.cshtml‎

Lines changed: 37 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,37 @@
1+
@page "/"
2+
@namespace BlazorExample.Pages
3+
@addTagHelper *, Microsoft.AspNetCore.Mvc.TagHelpers
4+
@{
5+
Layout = null;
6+
}
7+
8+
<!DOCTYPE html>
9+
<html lang="en">
10+
<head>
11+
<meta charset="utf-8" />
12+
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
13+
<title>BlazorExample</title>
14+
<base href="~/" />
15+
<link rel="stylesheet" href="css/bootstrap/bootstrap.min.css" />
16+
<link href="css/site.css" rel="stylesheet" />
17+
<link href="_content/Syncfusion.Blazor/styles/material.css" rel="stylesheet" />
18+
</head>
19+
<body>
20+
<app>
21+
<component type="typeof(App)" render-mode="ServerPrerendered" />
22+
</app>
23+
24+
<div id="blazor-error-ui">
25+
<environment include="Staging,Production">
26+
An error has occurred. This application may no longer respond until reloaded.
27+
</environment>
28+
<environment include="Development">
29+
An unhandled exception has occurred. See browser dev tools for details.
30+
</environment>
31+
<a href="" class="reload">Reload</a>
32+
<a class="dismiss">🗙</a>
33+
</div>
34+
35+
<script src="_framework/blazor.server.js"></script>
36+
</body>
37+
</html>

0 commit comments

Comments
 (0)