先上图:
代码实现:
<Canvas Grid.Column="1"><Border Background="#5665F4" BorderBrush="#5665F4" BorderThickness="0.5" CornerRadius="10,10,10,30"Width="180" Height="165" TextBlock.Foreground="White"Canvas.Left="16" Canvas.Top="90"><Border.Effect><DropShadowEffect BlurRadius="40" ShadowDepth="20" Direction="270" Color="#5665F4" Opacity="0.2"/></Border.Effect><Grid Margin="0,0,0,20"><Grid.RowDefinitions><RowDefinition/><RowDefinition/><RowDefinition/><RowDefinition/></Grid.RowDefinitions><Border Height="0.4" Background="#DDD" VerticalAlignment="Bottom"/><StackPanel Orientation="Horizontal" VerticalAlignment="Center"TextBlock.FontSize="14" TextBlock.FontWeight="Bold"><TextBlock Text="" FontFamily="{StaticResource Iconfont}"FontSize="18" Margin="15,0"/><TextBlock Text="生产情况" VerticalAlignment="Center"/></StackPanel><TextBlock Text="累计生产量" Grid.Row="1" VerticalAlignment="Bottom" Margin="15,0"FontSize="11" Opacity="0.6"/><TextBlock VerticalAlignment="Bottom" HorizontalAlignment="Right"Grid.Row="1" Margin="15,0"><Run Text="263846" FontSize="18"/><Run Text="T" FontSize="15"/></TextBlock><TextBlock Text="累计生产量" Grid.Row="2" VerticalAlignment="Bottom" Margin="15,0"FontSize="11" Opacity="0.6"/><TextBlock VerticalAlignment="Bottom" HorizontalAlignment="Right"Grid.Row="2" Margin="15,0"><Run Text="83" FontSize="18"/><Run Text="%" FontSize="15"/></TextBlock><TextBlock Text="累计生产量" Grid.Row="3" VerticalAlignment="Bottom" Margin="15,0"FontSize="11" Opacity="0.6"/><TextBlock VerticalAlignment="Bottom" HorizontalAlignment="Right"Grid.Row="3" Margin="15,0"><Run Text="2" FontSize="18"/><Run Text="个" FontSize="15"/></TextBlock></Grid></Border><Border Background="#F5F7FB" BorderBrush="#C7C9DB" BorderThickness="0.5" CornerRadius="10,10,10,30"Width="170" Height="110" TextBlock.Foreground="#5665F4"Canvas.Left="210"><Border.Effect><DropShadowEffect BlurRadius="40" ShadowDepth="20" Direction="270" Color="#5665F4" Opacity="0.2"/></Border.Effect><Grid Margin="0,0,0,20"><Grid.RowDefinitions><RowDefinition/><RowDefinition/><RowDefinition/></Grid.RowDefinitions><Border Height="0.4" Background="#C7C9DB" VerticalAlignment="Bottom"/><StackPanel Orientation="Horizontal" VerticalAlignment="Center"TextBlock.FontSize="14" TextBlock.FontWeight="Bold"><TextBlock Text="" FontFamily="{StaticResource Iconfont}"FontSize="18" Margin="15,0"/><TextBlock Text="人员情况" VerticalAlignment="Center"/></StackPanel><TextBlock Text="生产人员" Grid.Row="1" VerticalAlignment="Bottom" Margin="15,0"FontSize="11" Opacity="0.6"/><TextBlock VerticalAlignment="Bottom" HorizontalAlignment="Right"Grid.Row="1" Margin="15,0"><Run Text="245" FontSize="20"/><Run Text="人" FontSize="15"/></TextBlock><TextBlock Text="出勤率" Grid.Row="2" VerticalAlignment="Bottom" Margin="15,0"FontSize="11" Opacity="0.6"/><TextBlock VerticalAlignment="Bottom" HorizontalAlignment="Right"Grid.Row="2" Margin="15,0"><Run Text="92" FontSize="20"/><Run Text="%" FontSize="15"/></TextBlock></Grid></Border><Border Background="#225665F4" BorderBrush="#5665F4" BorderThickness="0.5" CornerRadius="10,10,10,25"Width="160" Height="80" TextBlock.Foreground="#FFF"Canvas.Left="250" Canvas.Top="200"><Border.Effect><DropShadowEffect BlurRadius="40" ShadowDepth="20" Direction="270" Color="#5665F4" Opacity="0.2"/></Border.Effect><Grid Margin="0,0,0,20"><Grid.RowDefinitions><RowDefinition/><RowDefinition/></Grid.RowDefinitions><Border Height="0.4" Background="#5665F4" VerticalAlignment="Bottom"/><StackPanel Orientation="Horizontal" VerticalAlignment="Center"TextBlock.FontSize="14" TextBlock.FontWeight="Bold"><TextBlock Text="" FontFamily="{StaticResource Iconfont}"FontSize="18" Margin="15,0"/><TextBlock Text="质量情况" VerticalAlignment="Center"/></StackPanel><TextBlock Text="通过质检比例" Grid.Row="1" VerticalAlignment="Bottom" Margin="15,0"FontSize="11" Opacity="0.6"/><TextBlock VerticalAlignment="Bottom" HorizontalAlignment="Right"Grid.Row="1" Margin="15,0"><Run Text="94" FontSize="20"/><Run Text="%" FontSize="15"/></TextBlock></Grid></Border></Canvas>