blazor-devexpress-dot-blazor-b7c8f0f6.md
Contains settings for the element’s margins.
Namespace : DevExpress.Blazor
Assembly : DevExpress.Blazor.v25.2.dll
NuGet Package : DevExpress.Blazor
public class DxMarginSettings :
DxSettingsComponent<MarginSettingsModel>
Use DxMarginSettings objects to customize margin settings for the following components:
The DxMarginSettings component allows you to configure Top, Right, Bottom, and Left margins.
The following code snippet sets margins for DxSparkline:
<DxSparkline Data="@DataSource"
CssClass="myCssClass"
Type="SparklineType.Bar"
ArgumentFieldName="Month"
ValueFieldName="VisitorCount"
Height="50px"
Width="200px">
<DxMarginSettings Top="10" Right="20" Bottom="10" Left="20"/>
</DxSparkline>
@code {
IEnumerable<SparklineDataPoint> DataSource = Enumerable.Empty<SparklineDataPoint>();
protected override void OnInitialized() {
DataSource = GenerateData();
}
}
public List<SparklineDataPoint> GenerateData() {
return new List<SparklineDataPoint>() {
new SparklineDataPoint( 01, 2132),
new SparklineDataPoint( 02, 2103),
new SparklineDataPoint( 03, 2460),
new SparklineDataPoint( 04, 2152),
new SparklineDataPoint( 05, 2062),
new SparklineDataPoint( 06, 1934),
new SparklineDataPoint( 07, 2112),
new SparklineDataPoint( 08, 1967),
new SparklineDataPoint( 09, 2009),
new SparklineDataPoint( 10, 2087),
new SparklineDataPoint( 11, 2112),
new SparklineDataPoint( 12, 2038),
};
}
public class SparklineDataPoint {
public int Month { get; set; }
public int? VisitorCount { get; set; }
public SparklineDataPoint(int month, int? visitorCount) {
Month = month;
VisitorCount = visitorCount;
}
}
.myCssClass .dxbl-widget-container {
border: 1px solid black;
}
Object ComponentBase DxSettingsComponent<DevExpress.Blazor.ClientComponents.Internal.MarginSettingsModel> DxMarginSettings
See Also