Telerik Forums
UI for Blazor Forum
2 answers
471 views

If you use the Blazor repl link below and make the dimensions of the signature pad relatively large and you draw two lines in quick succession it sometimes doesn't draw the second line correctly.

For example, if I make the width 1000px and the height 400px (or more) and attempt to use my mouse to write my own name which starts with a D, I can draw the vertical line first and if I draw the curved line to complete the D too quickly it will sometimes draw a straight line from start to finish rather than following the curve that I made with the mouse. It's like there's some sort of lag occurring before you can draw a second line. If I wait a couple seconds before drawing the second line it works. The larger you make the signature pad the more pronounced this issue is. You can also see this if you use your mouse to draw several random lines in quick succession.

When the dimensions are smaller, say 500px x 200px it mostly works okay, but if I have a user running a big ipad pro then having to limit the signature pad size like that isn't going to work very well. Is there any way to resolve this?

https://blazorrepl.telerik.com/QnYKEGvE34EIrAdC04?_ga=2.93311705.595058249.1696447250-1661447875.1621547203&_gl=1*1yfgby6*_ga*MTY2MTQ0Nzg3NS4xNjIxNTQ3MjAz*_ga_9JSNBCSF54*MTY5NjU0MTk5Ni4yOTQuMC4xNjk2NTQxOTk2LjYwLjAuMA..

Doug
Top achievements
Rank 1
Iron
Iron
Veteran
 answered on 17 Oct 2023
1 answer
356 views

Hi,

Is there a way of having a timespan (or duration) component in Blazor at all, like the one mentioned here for Xamerin:

https://www.telerik.com/blogs/choose-time-duration-telerik-timespan-picker-xamarin

Apologies if I have missed it in the docs.

Regards,

Rawden.

Hristian Stefanov
Telerik team
 answered on 17 Oct 2023
2 answers
756 views

Hi - can someone please point me towards definitive documentation for all the Telerik CSS classes and how they work with the Telerik UI for Blazor components - and for other html elements too? I don't mean documentation on how to install/configure the actual styles/style sheets - I mean documentation on the actual css classes themselves.

(I'm using the default theme - but it would be good to have CSS docs for the other themes too.)

For example, I see examples that use classes like "k-d-flex-col k-align-items-center k-justify-content-evenly" ... I can guess what they do from the context, but it would be nice to see some nicely organized documentation on these and other "k-..." classes and how to use them.

Thanks,

Tim.

Mark
Top achievements
Rank 3
Iron
Iron
Iron
 answered on 17 Oct 2023
0 answers
121 views

Hi there

We have a Scheduler with three resources defined which is working as expected. I've removed a bunch of tags for simplicity:

<TelerikScheduler
    Data="@Flights"
    AllowCreate="true"
    AllowDelete="false"
    AllowUpdate="true"
    OnEdit="@Edit">
    <SchedulerResources>
        <SchedulerResource
            Field="@nameof(Flight.SquadronEntityRowId)"
            Title="Squadron"
            Data="@_allSquadrons"
            TextField="@nameof(Squadron.Name)"
            ValueField="@nameof(Squadron.SquadronEntityRowId)"
        />
        <SchedulerResource
            Field="@nameof(Flight.AircraftEntityRowId)"
            Title="Aircraft"
            Data="@_allAircraft"
            TextField="@nameof(Aircraft.TailFinId)"
            ValueField="@nameof(Aircraft.AircraftEntityRowId)"
            ColorField="@nameof(Aircraft.Colour)"
        />
        <SchedulerResource
            Field="@nameof(Flight.AircraftType)"
            Title="Aircraft Type"
            Data="@SelectedAircraftTypes"
            TextField="@nameof(AircraftType.Name)"
            ValueField="@nameof(AircraftType.AircraftTypeEntityRowId)"
            ColorField="@nameof(AircraftType.Color)"
            />
    </SchedulerResources>
    <SchedulerSettings>
        <SchedulerGroupSettings Resources="@(new List<string> { nameof(Flight.SquadronEntityRowId) })" Orientation="@SchedulerGroupOrientation.Horizontal"></SchedulerGroupSettings>
    </SchedulerSettings>
</TelerikScheduler>

As you can see, we have grouping defined on one of the resources. This seems to work in the UI (aircraft and groups redacted for client confidentiality):

However, despite having set AllowCreate="true", when doubling clicking an empty slot the OnEdit event doesn't fire.

If I clear resource grouping however, double clicking then fires the edit event as expected:


Can someone please help us understand why creating new appointments when resource grouping is on isn't working? Is this intended behaviour?

Cheers,

Paul

Paul
Top achievements
Rank 1
 asked on 16 Oct 2023
1 answer
520 views

I'm getting the below error as I'm trying to update to .net8.  I've also created a bare minimum blazor web application with the same results. I'm not finding any Telerik .net8 documentation related to Blazor UI so I'm not sure what is missing? Is not.8 not currently supported?

"Unhandled exception rendering component: A Telerik component on the requested view requires a TelerikRootComponent to be added to the root of the MainLayout component of the app. Read more at: https://docs.telerik.com/blazor-ui/getting-started/what-you-need#project-configuration."

Code

Program.cs

app.UseStaticFiles();

App.razor

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="utf-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <base href="/" />
    <link rel="stylesheet" href="bootstrap/bootstrap.min.css" />
    <link rel="stylesheet" href="app.css" />
    <link rel="stylesheet" href="BlazorWebApp.styles.css" />
    <link rel="icon" type="image/png" href="favicon.png" />
    <link rel="stylesheet" href="_content/Telerik.UI.for.Blazor/css/kendo-theme-default/all.css" />
    
    <HeadOutlet />
</head>

<body>
    <Routes />
    <script src="_framework/blazor.web.js"></script>
    <script src="_content/Telerik.UI.for.Blazor/js/telerik-blazor.js" defer></script>
</body>

</html>

MainLayout.razor

@inherits LayoutComponentBase

<TelerikRootComponent>
<div class="page">
    <div class="sidebar">
        <NavMenu />
    </div>

    <main>
        <div class="top-row px-4">
            <a href="https://learn.microsoft.com/aspnet/core/" target="_blank">About</a>
        </div>

        <article class="content px-4">
            
                @Body
          
        </article>
    </main>
</div>

<div id="blazor-error-ui">
    An unhandled error has occurred.
    <a href="" class="reload">Reload</a>
    <a class="dismiss">🗙</a>
</div>
</TelerikRootComponent>

counter


@page "/counter"
@using Telerik.Blazor.Components.Editor
@attribute [RenderModeInteractiveServer]

<PageTitle>Counter</PageTitle>

<h1>Counter</h1>

<p role="status">Current count: @currentCount</p>

<button class="btn btn-primary" @onclick="IncrementCount">Click me</button>
<TelerikEditor @bind-Value="@Value"
			   Tools="@Tools"
			   Height="880px">
</TelerikEditor>

Dennis
Top achievements
Rank 1
Iron
 answered on 16 Oct 2023
1 answer
273 views

I am working with a grid that uses paging.  One of the options I expose to the user is to allow for a page size of "all" to show all records.  When selected, it can take the grid 10-20 seconds to display all those records, but there is no indication to the user that there is processing going on.  I saw another ticket that mentioned using the PageSizeChanged & onRead event to display a loading image, but that loading image is still delayed.

Is there another way to achieve the goal of showing a loading spinner when the grid is doing larger operations.  Paging, filtering, etc...

Thanks in advance

Dimo
Telerik team
 answered on 13 Oct 2023
1 answer
298 views

Hi, 
I'm upgrading my Telerik version to 4.6.0 and when I want to use custom FontIcon the icon is not displayed. I see in the HTML that my icon content is defined the same in both situations.

It work with the FontIcon.FilterClear but not with the custom:

<TelerikButton Icon="@FontIcon.FilterClear"> Font Icon Button <TelerikButton />

<TelerikButton Icon="@("k-icon k-i-filter-clear")">Custon Font Icon Button<TelerikButton />

Dimo
Telerik team
 answered on 13 Oct 2023
1 answer
95 views

Hi, in a combobox with filter and custom values, if user start typing and there are no items corresponding to the filter the dropdown is open also if it is empty. 

Is it possibile to avoid this and open dropdown only if there are items?

 

PS. Also Autocomplete component have same behaviour

Thank you

Dimo
Telerik team
 answered on 12 Oct 2023
1 answer
175 views

I have a user requesting to change the row height (style) for a Gantt control. The user made a similar request for a TreeList and a Grid and I was able to identify the properties in css and override them with padding-block and padding-line. I tried the same for the Gantt control but those properties did not achieve the desired result.

Here is the spacing they want that I was able to set for the TreeList and Grid controls:

 

I was able to achieve that with the following css:

.k-grid-md td, .k-grid-md .k-table-td, .k-button-md {
    padding-block: 0;
    padding-inline: 0;
}

 

The k-button-md was needed to reduce the padding if there was a command button on the row.

 

Here is what the Gantt control looks like now:

 

Any suggestions on how to achieve the same on the Gantt control?

Dimo
Telerik team
 answered on 12 Oct 2023
2 answers
1.8K+ views

Hello

Could Font Awesome be used with Telerik Blazor? And if so, how do I integrate and use it into the project?

Thank you.

Kind regards

Dimo
Telerik team
 answered on 11 Oct 2023
Narrow your results
Selected tags
Tags
+? more
Top users last month
Rob
Top achievements
Rank 3
Bronze
Iron
Iron
Sergii
Top achievements
Rank 1
Iron
Iron
Dedalus
Top achievements
Rank 1
Iron
Iron
Lan
Top achievements
Rank 1
Iron
Doug
Top achievements
Rank 1
Want to show your ninja superpower to fellow developers?
Top users last month
Rob
Top achievements
Rank 3
Bronze
Iron
Iron
Sergii
Top achievements
Rank 1
Iron
Iron
Dedalus
Top achievements
Rank 1
Iron
Iron
Lan
Top achievements
Rank 1
Iron
Doug
Top achievements
Rank 1
Want to show your ninja superpower to fellow developers?
Want to show your ninja superpower to fellow developers?