Mini Kabibi Habibi
<view:ViewBase x:Class="DevExpress.MailClient.Xpf.View.ContactsList"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
xmlns:dxe="http://schemas.devexpress.com/winfx/2008/xaml/editors"
xmlns:dxg="http://schemas.devexpress.com/winfx/2008/xaml/grid"
xmlns:dxb="http://schemas.devexpress.com/winfx/2008/xaml/bars"
xmlns:dxr="http://schemas.devexpress.com/winfx/2008/xaml/ribbon"
xmlns:dxlc="http://schemas.devexpress.com/winfx/2008/xaml/layoutcontrol"
xmlns:view="clr-namespace:DevExpress.MailClient.Xpf.View"
mc:Ignorable="d"
d:DesignHeight="300" d:DesignWidth="400">
<view:ViewBase.Resources>
<view:EmptyPhotoConverter x:Key="EmptyPhotoConverter"/>
<DataTemplate x:Key="cardTemplate">
<Grid>
<Grid.RowDefinitions>
<RowDefinition Height="Auto"/>
<RowDefinition Height="Auto"/>
<RowDefinition Height="Auto"/>
<RowDefinition Height="Auto"/>
</Grid.RowDefinitions>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="100"/>
<ColumnDefinition Width="200"/>
</Grid.ColumnDefinitions>
<dxe:ImageEdit Grid.RowSpan="4" Margin="0,0,8,0" Stretch="UniformToFill" Source="{Binding Path=DataContext.Photo, Converter={StaticResource EmptyPhotoConverter}}" ShowMenu="False" />
<TextBlock Grid.Row="0" Grid.Column="1" Text="{Binding Path=DataContext.Name.FullName}" TextWrapping="Wrap"/>
<TextBlock Grid.Row="1" Grid.Column="1" Text="{Binding Path=DataContext.Email}" TextWrapping="Wrap"/>
<TextBlock Grid.Row="2" Grid.Column="1" Text="{Binding Path=DataContext.Phone}" TextWrapping="Wrap"/>
<TextBlock Grid.Row="3" Grid.Column="1" Text="{Binding Path=DataContext.Address}" TextWrapping="Wrap"/>
</Grid>
</DataTemplate>
<dxg:TableView x:Key="TableView" AllowEditing="False" AutoWidth="True" ShowAutoFilterRow="True" ShowSearchPanelMode="Always" ShowGroupedColumns="True" ShowGroupPanel="False"/>
<dxg:CardView x:Key="CardView" AllowEditing="False" CardTemplate="{StaticResource cardTemplate}"/>
</view:ViewBase.Resources>
<dxb:BarManager>
<dxb:BarManager.Items>
<dxb:BarButtonItem Content="New Contact" Name="biNew" Command="{Binding Commands.NewContact}" LargeGlyph="/DevExpress.MailClient.Xpf;component/Images/Contacts/NewContact_32x32.png"/>
<dxb:BarButtonItem Content="Edit Contact" Name="biEdit" Command="{Binding Commands.EditContact}" LargeGlyph="/DevExpress.MailClient.Xpf;component/Images/Contacts/EditContact_32x32.png"/>
<dxb:BarButtonItem Content="Delete" Name="biDelete" Command="{Binding Commands.DeleteContact}" Glyph="/DevExpress.MailClient.Xpf;component/Images/Delete_16x16.png" LargeGlyph="/DevExpress.MailClient.Xpf;component/Images/Delete_32x32.png"/>
<dxr:RibbonGalleryBarItem x:Name="bLayout">
<dxr:RibbonGalleryBarItem.Gallery>
<dxb:Gallery MinColCount="2">
<dxb:Gallery.Groups>
<dxb:GalleryItemGroup>
<dxb:GalleryItem x:Name="ListItem" Caption="List" Command="{Binding Commands.SetListView}" Glyph="/DevExpress.MailClient.Xpf;component/Images/Contacts/List_32x32.png"/>
<dxb:GalleryItem x:Name="AlphabetItem" Caption="By Alphabet" Command="{Binding Commands.GroupByAlphabet}" Glyph="/DevExpress.MailClient.Xpf;component/Images/Contacts/Alphabetical_32x32.png"/>
<dxb:GalleryItem x:Name="StateItem" Caption="By State" Command="{Binding Commands.GroupByState}" Glyph="/DevExpress.MailClient.Xpf;component/Images/Contacts/ByState_32x32.png"/>
<dxb:GalleryItem x:Name="CardItem" Caption="Card" Command="{Binding Commands.SetCardView}" Glyph="/DevExpress.MailClient.Xpf;component/Images/Contacts/Card_32x32.png"/>
</dxb:GalleryItemGroup>
</dxb:Gallery.Groups>
</dxb:Gallery>
</dxr:RibbonGalleryBarItem.Gallery>
</dxr:RibbonGalleryBarItem>
</dxb:BarManager.Items>
<Grid>
<Grid.RowDefinitions>
<RowDefinition Height="Auto"/>
<RowDefinition Height="*"/>
</Grid.RowDefinitions>
<dxr:RibbonControl x:Name="contactRibbon" Grid.Row="0" RibbonStyle="Office2010">
<dxr:RibbonDefaultPageCategory>
<dxr:RibbonPage Caption="Contacts" MergeOrder="-2">
<dxr:RibbonPageGroup Caption="New/Edit" Name="grpSave" ShowCaptionButton="False">
<dxb:BarButtonItemLink BarItemName="biNew" />
<dxb:BarButtonItemLink BarItemName="biEdit" />
<dxb:BarItemLinkSeparator/>
<dxb:BarButtonItemLink BarItemName="biDelete" />
</dxr:RibbonPageGroup>
<dxr:RibbonPageGroup Caption="Current View">
<dxr:RibbonGalleryBarItemLink BarItemName="bLayout"/>
</dxr:RibbonPageGroup>
</dxr:RibbonPage>
</dxr:RibbonDefaultPageCategory>
</dxr:RibbonControl>
<dxlc:LayoutControl Margin="0" Padding="0" Grid.Row="1">
<dxg:GridControl x:Name="grid" ItemsSource="{Binding ItemsSource}" AutoExpandAllGroups="True" SelectedItem="{Binding CurrentContact, Mode=TwoWay}">
<dxg:GridControl.Margin>
<Binding Path="CurrentView">
<Binding.Converter>
<view:ViewToMarginConverter/>
</Binding.Converter>
</Binding>
</dxg:GridControl.Margin>
<dxg:GridControl.Columns>
<dxg:GridColumn Header="Name" Binding="{Binding Name.FullName}" GroupInterval="Alphabetical">
<dxg:GridColumn.GroupIndex>
<Binding Path="CurrentGroupField" Mode="TwoWay">
<Binding.Converter>
<view:GroupFieldToGroupIndexConverter GroupField="Name"/>
</Binding.Converter>
</Binding>
</dxg:GridColumn.GroupIndex>
</dxg:GridColumn>
<dxg:GridColumn FieldName="Email" Width="230"/>
<dxg:GridColumn Header="State" Binding="{Binding Address.State}">
<dxg:GridColumn.GroupIndex>
<Binding Path="CurrentGroupField" Mode="TwoWay">
<Binding.Converter>
<view:GroupFieldToGroupIndexConverter GroupField="State"/>
</Binding.Converter>
</Binding>
</dxg:GridColumn.GroupIndex>
</dxg:GridColumn>
<dxg:GridColumn Header="City" Binding="{Binding Address.City}"/>
<dxg:GridColumn FieldName="Phone"/>
</dxg:GridControl.Columns>
<dxg:GridControl.View>
<Binding Path="CurrentView"/>
</dxg:GridControl.View>
</dxg:GridControl>
<Grid dxlc:LayoutControl.AllowHorizontalSizing="True" Width="250" Margin="4,0,0,0">
<Grid.Visibility>
<Binding Path="CurrentView">
<Binding.Converter>
<view:ViewToVisibilityConverter/>
</Binding.Converter>
</Binding>
</Grid.Visibility>
<TextBlock Text="No contact selected" FontFamily="Segoe UI" FontSize="16" HorizontalAlignment="Center" VerticalAlignment="Center">
<TextBlock.Opacity>
<Binding Path="SelectedItem" ElementName="grid">
<Binding.Converter>
<view:ObjectToOpacityConverter Opacity="0.5" Invert="True"/>
</Binding.Converter>
</Binding>
</TextBlock.Opacity>
</TextBlock>
<Grid>
<Grid.Opacity>
<Binding Path="SelectedItem" ElementName="grid">
<Binding.Converter>
<view:ObjectToOpacityConverter Opacity="1" Invert="False"/>
</Binding.Converter>
</Binding>
</Grid.Opacity>
<Grid.RowDefinitions>
<RowDefinition Height="Auto"/>
<RowDefinition Height="Auto"/>
<RowDefinition Height="Auto"/>
<RowDefinition Height="Auto"/>
<RowDefinition Height="Auto"/>
</Grid.RowDefinitions>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="Auto"/>
<ColumnDefinition Width="*"/>
</Grid.ColumnDefinitions>
<dxe:ImageEdit Grid.ColumnSpan="2" EditValue="{Binding SelectedItem.Photo, ElementName=grid, Converter={StaticResource EmptyPhotoConverter}}" IsReadOnly="True" Margin="0,0,0,4"/>
<TextBlock Grid.Row="1" Grid.Column="0" Text="Name:" Margin="0,0,4,2"/>
<TextBlock Grid.Row="1" Grid.Column="1" Text="{Binding SelectedItem.Name.FullName, ElementName=grid}" TextWrapping="Wrap" Margin="0,0,0,2"/>
<TextBlock Grid.Row="2" Grid.Column="0" Text="Email:" Margin="0,0,4,2"/>
<TextBlock Grid.Row="2" Grid.Column="1" Text="{Binding SelectedItem.Email, ElementName=grid}" TextWrapping="Wrap" Margin="0,0,0,2"/>
<TextBlock Grid.Row="3" Grid.Column="0" Text="Address:" Margin="0,0,4,2"/>
<TextBlock Grid.Row="3" Grid.Column="1" Text="{Binding SelectedItem.Address, ElementName=grid}" TextWrapping="Wrap" Margin="0,0,0,2"/>
<TextBlock Grid.Row="4" Grid.Column="0" Text="Phone:" Margin="0,0,4,0"/>
<TextBlock Grid.Row="4" Grid.Column="1" Text="{Binding SelectedItem.Phone, ElementName=grid}" TextWrapping="Wrap"/>
</Grid>
</Grid>
</dxlc:LayoutControl>
</Grid>
</dxb:BarManager>
</view:ViewBase>