The default size of some components has been changed

What Changed

We decreased the default size of the following components (both stand-alone and displayed within container components):

• Button
• Calendar
• ComboBox
• Date Edit
• List Box
• Spin Edit
• TagBox
• Text Box
• Pager

Reasons for Change

According to our customers' feedback, the most commonly used editor size is small. That is why, we decided to apply this size by default so that you won’t have to redefine it in your applications.

Impact on Existing Apps

This change affects your application UI if it contains either of the updated components or a container component that includes an updated component(s).

How to Revert to Previous Behavior

A recommended approach depends on a component to be resized.

• To change the default size of a stand-alone component mentioned above, use the SizeMode property. To revert to the previous size, set this property to SizeMode.Medium.

Razor
<DxComboBox Data="@DataSource" SizeMode="SizeMode.Medium" />

• To change the default size of all resizable components located within a container component (Data Grid, Form Layout, Scheduler), use the InnerComponentSizeMode property (for Data Grid, Scheduler) or ItemSizeMode (for Form Layout). To revert to the previous size, set these properties to SizeMode.Medium.

Razor
<DxDataGrid DataAsync="@ForecastService.GetForecastAsync"  
            InnerComponentSizeMode="SizeMode.Medium">  
    <Columns>  
        ...  
    </Columns>  
</DxDataGrid>  

• To change the default size of all resizable components (both stand-alone and located within container components) in your application, use dependency injection to set the SizeMode global option to SizeMode.Medium.

  The code sample depends on your application's hosting model.

Blazor Server

C#
using Microsoft.Extensions.DependencyInjection;  

class Startup {  
    public void ConfigureServices(WebHostBuilderContext context, IServiceCollection services) {  
        ...  
        services.AddDevExpressBlazor(configure => configure.SizeMode = DevExpress.Blazor.SizeMode.Medium);  
    }  
}  

Blazor WebAssembly

C#
using Microsoft.Extensions.DependencyInjection;  

public class Program {  
    public static async Task Main(string[] args) {  
        ...  
        builder.Services.AddDevExpressBlazor((options) => options.SizeMode = SizeMode.Medium);  
        await builder.Build().RunAsync();  
    }  
}