CODEWITHSUNDEEP
c#wpfxaml
matthew
matthew

Reputation: 89

Display matrices in XAML

I'm working on an application which calculates several 4x4 matrices (2D double arrays).

private double[,] matrix1 = new double[4,4];
private double[,] matrix2 = new double[4,4];

After calculating the coefficients I want to display the matrices in my view. I'd like to use either box brackets (http://upload.wikimedia.org/math/e/2/b/e2b3fba5aaeb1ade3407ca02aa870a5e.png) or lage parentheses (http://upload.wikimedia.org/math/5/d/5/5d5847e4483c97c3f4c767ed15ab1c27.png).
Does XAML provide an element to display matrices this way? If not, is it possible to display the matrices in a similar way?

Upvotes: 2

Views: 1584

Answers (2)

Sheridan
Sheridan

Reputation: 69979

In WPF, you can easily create this look using Path objects to draw the sides (these ones are straight) and a UniformGrid to display the content:

<Window x:Class="WpfApplication1.MainWindow"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    Title="MainWindow" Height="350" Width="300">
    <Window.Resources>
        <Style TargetType="{x:Type TextBlock}">
            <Setter Property="TextAlignment" Value="Center" />
            <Setter Property="VerticalAlignment" Value="Center" />
        </Style>
    </Window.Resources>
    <Grid>
        <Grid.ColumnDefinitions>
            <ColumnDefinition Width="Auto" />
            <ColumnDefinition />
            <ColumnDefinition Width="Auto" />
        </Grid.ColumnDefinitions>
        <Path Grid.Column="0" Data="M 0,0 0,300 15,300 15,295 5,295 5,5 15,5 15,0" 
            Width="15" Height="300" Fill="Black" VerticalAlignment="Stretch" 
            HorizontalAlignment="Center" />
        <UniformGrid Grid.Column="1" Columns="2" Rows="2" TextElement.FontFamily=
            "Palatino Linotype" TextElement.FontSize="28">
            <TextBlock>
                <Run Text="a" />
                <Run Typography.Variants="Subscript" FontStyle="Italic" Text="11" />
            </TextBlock>
            <TextBlock>
                <Run Text="a" />
                <Run Typography.Variants="Subscript" FontStyle="Italic" Text="11" />
            </TextBlock>
            <TextBlock>
                <Run Text="a" />
                <Run Typography.Variants="Subscript" FontStyle="Italic" Text="21" />
            </TextBlock>
            <TextBlock>
                <Run Text="a" />
                <Run Typography.Variants="Subscript" FontStyle="Italic" Text="22" />
            </TextBlock>
        </UniformGrid>
        <Path Grid.Column="2" Data="M 15,0 15,300 0,300 0,295 10,295 10,5 0,5 0,0" 
            Width="15" Height="300" Fill="Black" VerticalAlignment="Stretch" 
            HorizontalAlignment="Center" />
    </Grid>
</Window>

There are two important things to note for this to work properly:

The TextElement.FontFamily that you choose must be able to display Subscript.

You can bind to the Run.Text properties instead of hard-coding values in as I have in your example:

<Run Text="{Binding Value1}" />
<Run Typography.Variants="Subscript" FontStyle="Italic" Text="{Binding Value2}" />

Upvotes: 1

Chris W.
Chris W.

Reputation: 23290

When in doubt, just fake it. This might work for you as a simple way to get the effect you're after. Example;

<Grid VerticalAlignment="Center" HorizontalAlignment="Center" MaxWidth="200">
   <Rectangle Stroke="Black" StrokeThickness="2" Fill="White"/>
   <Rectangle Fill="White" Margin="8,0"/>

   <TextBlock TextWrapping="Wrap" Margin="10">
      <Run Text="This would be all of your content here."/><LineBreak/><LineBreak/>
      <Run Text="If you just populate your content like this, then you could just put a Center Horizontal/Vertical Alignment on the Grid and it would only take up the space necessary."/>
   </TextBlock>

</Grid>

Hope this helps.

Upvotes: 1

Related Questions