Questions on UI for WPF Forum

2 answers

124 views

Hello,

I'm trying to have the carousel bind to xml data.

I Have a grid with textboxes, Image, and listbox.
Using xmlDataProvider and CollectionViewSource I'm able to point to the data file.
The issue is the data is grouped by employee name, the listbox populates the current list for that certain employee. But the IMage and other Employee info loses the binding. The Carousel populates the correct amount of employees etc.

When I Change the Data Content the Image and Employee Info binds, but the listbox data loses its binding and the Carousel populates every node in the xml file.

Here is the code:

XML FIle

<?xml version="1.0" encoding="UTF-8" standalone="yes"?>

<NewDataSet1 xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance">

<Table>

<RecipeID>117</RecipeID>

<RecipeName>1620 Shrimp</RecipeName>

<PrepTime>0.00347222222222222</PrepTime>

<Station>PULL</Station>

<Employee>Josa Sosa</Employee>

<Image>Male.jpg</Image>

</Table>

<Table>

<RecipeID>116</RecipeID>

<RecipeName>26/30 Shrimp</RecipeName>

<PrepTime>0.00347222222222222</PrepTime>

<Station>PULL</Station>

<Employee>Josa Sosa</Employee>

<Image>Male.jpg</Image>

</Table>

<Table>

<RecipeID>42</RecipeID>

<RecipeName>Ale and Cheddar Soup</RecipeName>

<PrepTime>0.03125</PrepTime>

<Station>SS</Station>

<Employee>Maria Anders</Employee>

<Image>Female.jpg</Image>

</Table>

<Table>

<RecipeID>41</RecipeID>

<RecipeName>Alfredo Sauce</RecipeName>

<PrepTime>0.03125</PrepTime>

<Station>SS</Station>

<Employee>Maria Anders</Employee>

<Image>Female.jpg</Image>

</Table>

<Table>

<RecipeID>126</RecipeID>

<RecipeName>American Cheese Portioned/Wrapped</RecipeName>

<PrepTime>0.00347222222222222</PrepTime>

<Station>BR</Station>

<Employee>Rick Mueller</Employee>

<Image>Male.jpg</Image>

</Table>

<Table>

<RecipeID>242</RecipeID>

<RecipeName>Apple Cinn Scones</RecipeName>

<PrepTime>0.0104166666666667</PrepTime>

<Station>PULL</Station>

<Employee>Josa Sosa</Employee>

<Image>Male.jpg</Image>

The XAML:

<UserControl.Resources>

<XmlDataProvider x:Key="ProductionData"

Source="Database/ProductionData.xml"

XPath="NewDataSet1/Table"/>

<CollectionViewSource x:Key="CallPrepData"

Source="{StaticResource ProductionData}">

<CollectionViewSource.SortDescriptions>

<scm:SortDescription PropertyName="Station" Direction="Ascending"/>

<scm:SortDescription PropertyName="RecipeName"/>

<scm:SortDescription PropertyName="Station"/>

<scm:SortDescription PropertyName="PrepTime"/>

<scm:SortDescription PropertyName="RecipeID"/>

<scm:SortDescription PropertyName="Image"/>

<scm:SortDescription PropertyName="Employee" Direction="Ascending"/>

</CollectionViewSource.SortDescriptions>

<CollectionViewSource.GroupDescriptions>

<PropertyGroupDescription PropertyName="Employee"/>

</CollectionViewSource.GroupDescriptions>

</CollectionViewSource>

<DataTemplate x:Key="TableTemplate">

<Grid >

<Image Height="107" HorizontalAlignment="Left" Source="{Binding XPath=IMage}" Margin="12,12,0,0" x:Name="image1" Stretch="Fill" VerticalAlignment="Top" Width="120" />

<TextBlock Height="40" HorizontalAlignment="Left" Margin="157,12,0,0" x:Name="Employeename" Text="{Binding XPath=Employee}" VerticalAlignment="Top" Width="180" FontSize="22"/>

<TextBlock Height="23" HorizontalAlignment="Left" Margin="157,43,0,0" x:Name="textBlock21" Text="Station:" VerticalAlignment="Top" Width="82" FontSize="12" />

<TextBlock Height="23" HorizontalAlignment="Left" Margin="157,66,0,0" x:Name="textBlock2" Text="Total Items" VerticalAlignment="Top" Width="82" FontSize="12" />

<TextBlock Height="23" HorizontalAlignment="Left" Margin="157,96,0,0" x:Name="textBlock3" Text="Total Prep Time:" VerticalAlignment="Top" Width="92" FontSize="12" />

<TextBlock Height="23" HorizontalAlignment="Left" Margin="256,66,50,0" x:Name="textBlock4" Text="{Binding ItemCount}" VerticalAlignment="Top" Width="44" FontSize="12" />

<TextBlock Height="23" HorizontalAlignment="Left" Margin="255,96,0,0" x:Name="textBlock5" Text="180 min" VerticalAlignment="Top" Width="82" FontSize="12" />

<TextBlock Height="23" HorizontalAlignment="Left" Margin="255,43,0,0" x:Name="Stat" Text="{Binding XPath=Station}" VerticalAlignment="Top" Width="82" FontSize="12" />

<ListBox

Margin="0,120,0,0"

HorizontalAlignment="Left"

x:Name="listBox2"

Height="490"

Background="Transparent"

BorderBrush="Transparent"

ItemsSource="{Binding Items}"

VerticalAlignment="Top" Width="449">

<ListBox.ItemTemplate>

<DataTemplate>

<StackPanel Orientation="Horizontal">

<Grid>

<Grid.ColumnDefinitions>

<ColumnDefinition Width="60*" />

<ColumnDefinition Width="241*" />

</Grid.ColumnDefinitions>

<TextBlock Text="{Binding XPath=RecipeID}"

Grid.Column="1" FontSize="16"/>

<TextBlock Text="{Binding XPath=RecipeName}"

Grid.Column="2" FontSize="16" Margin="50,0,0,0"/>

</Grid>

</StackPanel>

</DataTemplate>

</ListBox.ItemTemplate>

</ListBox>

</Grid>

</DataTemplate>

</UserControl.Resources>

<Grid Margin="0,0,8,180" DataContext="{Binding Source={StaticResource CallPrepData}}">

<telerik:RadCarousel

Margin="0,0,0,0"

Background="Transparent"

ItemsSource="{Binding Groups}"

ItemTemplate="{DynamicResource TableTemplate}" />

</Grid>

</UserControl>

Thoughts?
Thank you

Rick Mueller

Carousel

answered on 22 Sep 2010

1 answer

239 views

URGENT: Fixed size tiles and override of the default layout

Good day all
I am using the RadTileView but I am stuck. Basically we have a few items we are displaying (see pic 1) but because of the way the layout is done, as you can see it looks pretty bad. In addition I am using a MaxWidth/Height for the tiles. I am also using a datatemplate to wrap the fluidcontentcontrol. I have just an empty border for the Small and Content sections, and a grid for the Large one. Basically, we don't care to see anything in the small or normal layout - but these are always shown depending on the number of items in the panel. This is why I used fixed width and height. I have a few questions.
1. Since I do not know how to control the layout of the tiles, I used MaxH/W as previously mentioned.The problem is, with this, if you go to any other state (ex maximized), the size is still fixed (makes sense). However, on max I want to actually resize the tile. I came across another post with something like this:

private void criticalProviderAlert_TileStateChanged(object sender, Telerik.Windows.RadRoutedEventArgs e)

{

RadTileViewItem maximizedItem = criticalProviderAlert.ItemContainerGenerator.ContainerFromItem(criticalProviderAlert.MaximizedItem)

as RadTileViewItem;

if (maximizedItem != null )

{

maximizedItem.MaxHeight = 352;

maximizedItem.MaxWidth = 330;

return;

}



So now I can change the size when the tile state is changed (pic 2). However, when I go back to the restored state - pic 3 is what happens. I wanted it to look as it did when I first started the app.



2. The next problem is layout. Notice that even though I have given the tiles explicit values, the control is treating the tiles as if they are using the default values based on what the panel computed. This is apparent in pic 3. Ideally, I would like it to look like pic 4. Is there a way to override/change the layout behavior so that it respects my explicit values rather than the default ones?

Thanks - this is a cool control.



UPDATE:

I have a working solution for 1 where I can resize the tiles as I see fit. I am doing this in code behind (we are using mvvm) since this is just a view related issue. The code is as follows but if anyone has any other ideas, please feel free to share:


private void providerAlert_TileStateChanged(object sender, Telerik.Windows.RadRoutedEventArgs e)
{
    var s = e.Source;
    RadTileViewItem maximizedItem =
        providerAlert.ItemContainerGenerator.ContainerFromItem(providerAlert.MaximizedItem) as RadTileViewItem;
    if (maximizedItem != null )
    {
        maximizedItem.MaxHeight = 352;
        maximizedItem.MaxWidth = 330;
    }
    else
    {
        var tileItems = providerAlert.Items;
        foreach (var tile in tileItems)
        {
            var actualTile = providerAlert.ItemContainerGenerator.ContainerFromItem(tile) as RadTileViewItem;
            if(actualTile != null)
            {
                actualTile.MaxHeight = 50;   
            }
        }
    }
}

TileView

answered on 22 Sep 2010

1 answer

103 views

Alignment of controls in screen gets distorted

Hello,

I have a screen with radgrid and few comboboxes. I have not set the Height property of grid. When the number of rows increases above a certain limit(17 in my case) in the grid, the alignment of the other controls in the page gets distorted. Please find the attachment for one of the scenario.
In the attachment, you can see that when I select the combo box, values in the combobox are displayed in the top left corner.
If I Restore Down and Maximize the screen, the alignment becomes correct(Please see the attachment CorrectPageAlignment.jpg).

Any clue why the screen alignment gets distorted like this?

Thanks in Advance,
Norbert John

GridView

answered on 22 Sep 2010

1 answer

126 views

Docking and DocumentHost issue using in prism

Hi,

I have written the following xaml

<

radDock:RadDocking>

<radDock:RadDocking.DocumentHost>

<radDock:RadSplitContainer>

<radDock:RadPaneGroup ItemContainerStyle="{StaticResource RadPanelStyle}" prismrgn:RegionManager.RegionName="MaintenanceTabRegion" />

</radDock:RadSplitContainer>

</radDock:RadDocking.DocumentHost>

<radDock:RadSplitContainer InitialPosition="DockedBottom" Height="350">

<radDock:RadPaneGroup ItemContainerStyle="{StaticResource RadPanelStyle}" prismrgn:RegionManager.RegionName="ProperyRegion" />

</radDock:RadSplitContainer>

</radDock:RadDocking>

When I am writting the above xaml in Shell window as parent region it is working i mean regions are creating but If my shellwindow is a contentControl as parent region and my view contains the above code. and loading in the contentcontrol region, "MaintenanceTabRegion" region is not created because of RadTabItem intialization gives error where as "ProperyRegion" region is created.( I debugged the prism code), If I Use RadTabControl as my region "MaintenanceTabRegion" it is creating..
any body can help to fix this issue.. It is urgent requirment...

Thanks

Bichitra

Docking

answered on 22 Sep 2010

1 answer

263 views

Single line row

Hi,
I have a text field with multiple lines which is used to bind to a telerik row. I want to show only one line in the cell with "..." at the end if the field has multiple line.

Right now I have manged to fix the row height by changing the row style, but dont know how to add ... at the end if there is multi line. Is there any built in way to do this. (Hope this can be achieved using a converter, but want to check if grid allows.)

GridView

answered on 22 Sep 2010

1 answer

198 views

GridViewCheckBox style

I am trying to style the GridViewCheckBox in my application, but I can't seem to get the GridViewCheckBox style to take effect. I would like to show the CheckBox without a box around it (just the check or no check).

Using Blend, this is what I got for a style:

<ResourceDictionary

xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"

xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" xmlns:telerik="http://schemas.telerik.com/2008/xaml/presentation">

<Style TargetType="{x:Type telerik:GridViewCheckBox}">

<Setter Property="Template">

<Setter.Value>

<ControlTemplate TargetType="{x:Type telerik:GridViewCheckBox}">

<Grid HorizontalAlignment="Left" VerticalAlignment="Center" Width="13" Height="13">

<Grid Margin="0">

<Path x:Name="IndeterminatePath" Stretch="Fill" Stroke="#FF8D8D8D" StrokeThickness="1.5" HorizontalAlignment="Center" Margin="0" VerticalAlignment="Center" Width="7" Height="7" Visibility="Collapsed" Data="M14.708333,144.5L20.667,144.5"/>

<Path x:Name="CheckedPath" Stretch="Fill" Stroke="#FF8D8D8D" StrokeThickness="1.5" HorizontalAlignment="Center" Margin="0" VerticalAlignment="Center" Visibility="Collapsed" Data="M32.376187,77.162509L35.056467,80.095277 40.075451,70.02144"/>

</Grid>

<ControlTemplate.Triggers>

<Trigger Property="IsChecked" Value="True">

<Setter Property="Visibility" TargetName="CheckedPath" Value="Visible"/>

</Trigger>

<Trigger Property="IsThreeState" Value="True">

<Setter Property="Visibility" TargetName="IndeterminatePath" Value="Visible"/>

</Trigger>

</ControlTemplate.Triggers>

</ControlTemplate>

</Setter.Value>

</Setter>

</Style>

</ResourceDictionary>

I also see there is a class for the GridViewCheckBoxColumn, but I have been unsuccessful in changing the style template of that either.

How can I style the checkbox?

Thanks.

GridView

answered on 22 Sep 2010

2 answers

197 views

Changing the row background through bindings

Hi,

In my GridView I need to change the background of certain rows depending on one property of the object bound to that row. I found the forum thread below which explains how to do it but as soon as I change the references on the examples posted to the latest version of the GridView it does not compile. Would you please update the example or point me to another solution?

http://www.telerik.com/community/forums/wpf/gridview/how-can-i-apply-different-colors-to-radgridview-rows-through-bindings.aspx

Best Regards,
Jose Simas

GridView

answered on 22 Sep 2010

1 answer

61 views

keep tiles all one size ?

Hi I want most of the functionality of the tile view control, but I dont want to allow resizing - hence the height and width are fixed... Is this possible ? If not, any other controls that I could do a kind of tile approach (like on the iphone?)...

Cheers
Mark

TileView

answered on 22 Sep 2010

1 answer

91 views

Data Edited in XML

Hello,
Currently I have a gridview populated with Data from local database(XML)

One of the features is to edit /add and save data to a database.
Is is possible to edit or add data to gridview and it will save it to the current xml file?

I hope that makes sense..
Regards,
Rick Mueller

GridView

answered on 22 Sep 2010

1 answer

189 views

DataPager not working quite right with QueryableCollectionView

I have a IQueryable<T>, I'm wrapping it with a QueryableCollectionView. Setting the PageSize to 100. There are some 1500 items in the collection.

<Grid>

<Grid.RowDefinitions>

<RowDefinition

Height="*" />

<RowDefinition

Height="Auto" />

</Grid.RowDefinitions>

<telerik:RadGridView

Grid.Row="0"

AutoGenerateColumns="True"

ItemsSource="{Binding PagedSource}" />

<telerik:RadDataPager

Grid.Row="1"

Source="{Binding PagedSource}"

DisplayMode="All"

IsTotalItemCountFixed="False" />

</Grid>

The GridView works fine. It shows only the first 100 records. The DataPager however renders showing page " " of 1, and doesn't let me change pages. It looks unaware of the QueryableCollectionView. I'm not sure what I'm missing. I'm assuming it's in setting up the Source improperly somehow.

DataPager

answered on 22 Sep 2010