I have a Telerik RadTimeBar in my XAML, I could easily customize whatever I wanted except the interval label placement. In the telerik demos intervals are somehow drawn inside the actual time bar, not on top of that. Here's a snapshot demonstrating it. I need to position day intervals the way Weeks are displayed here:
Whatever I do, I keep getting this rendered on the screen:
Here's my XAML:
<telerik:RadTimeBar Grid.Row="2" x:Name="multiDayTimeBar"
PeriodStart="{Binding TimeBarRangeStart}"
PeriodEnd="{Binding TimeBarRangeEnd}"
SelectionChanged="multiDayTimeBar_SelectionChanged"
SelectionStart="{Binding TimeBarSelectedStart, Mode=TwoWay}"
SelectionEnd="{Binding TimeBarSelectedEnd, Mode=TwoWay}"
ScrollMode="None"
HorizontalAlignment="Stretch">
<telerik:RadTimeBar.Intervals>
<telerik:DayInterval />
<telerik:HourInterval/>
</telerik:RadTimeBar.Intervals>
<telerik:RadLinearSparkline Margin="0,3"
LineStroke="#FF767676"
ItemsSource="{Binding TimeBarSource}"
XValuePath="Timestamp"
YValuePath="DemandValue" />
</telerik:RadTimeBar>
Digging through the API documentation didn't help. Telerik's demo codes do not hint something either. If someone had a similar problem, any advice would be appreciated.
Thank you.
I have the WPF UI demos installed on my computer. After taking a look at the TimeBar example they give this code:
<telerik:RadTimeBar Name="timeBar1" Height="150"
PeriodStart="{Binding PeriodStart, Mode=TwoWay}"
PeriodEnd="{Binding PeriodEnd, Mode=TwoWay}"
VisiblePeriodStart="{Binding VisiblePeriodStart, Mode=TwoWay}"
VisiblePeriodEnd="{Binding VisiblePeriodEnd, Mode=TwoWay}"
SelectionStart="{Binding SelectedStartDate, Mode=TwoWay}"
SelectionEnd="{Binding SelectedEndDate, Mode=TwoWay}"
MinSelectionRange="{Binding MinSelectionRange, Mode=TwoWay}"
IsSnapToIntervalEnabled="True">
<telerik:RadTimeBar.Intervals>
<telerik:QuarterInterval />
<telerik:MonthInterval />
<telerik:WeekInterval />
<telerik:DayInterval />
<telerik:HourInterval/>
</telerik:RadTimeBar.Intervals>
<telerik:RadLinearSparkline LineStroke="#FF767676" ItemsSource="{Binding ServerInfos}" XValuePath="Date" YValuePath="UniqueVisitors" />
</telerik:RadTimeBar>
Which they say produces this time bar:
Not sure if this will help you or not, but the only thing that I could see that was different is that they set the IsSnapToIntervalEnabled="True" the VisiblePeriodStart and the VisiblePeriodEnd. Think these might need to be set?
Related
I need help trying to understand why this is not working. According to MSDN, TemplateBinding is what should be used when binding the property of a control in a template to a property of the control implementing the template.
Except that Template Binding is not two-way. For two-way you need to use binding and then specify the relative source as TemplatedParent.
So I have the following XAML:
template
<ItemContainerTemplate x:Key="colHeaderTemplate">
<StackPanel Orientation="Horizontal">
<TextBlock Text="{Binding}" VerticalAlignment="Center"/>
<ToggleButton Style="{StaticResource ToggleButtonStyle}" IsChecked="{Binding RelativeSource={RelativeSource Mode=TemplatedParent}, Mode=TwoWay, Path=(props:VisibilityHelper.IsGroupCollapsed)}"/>
</StackPanel>
</ItemContainerTemplate>
which is used here
<dxg:GridColumn x:Name="Total" Header="Total" FieldName="field1" Width="Auto" HorizontalHeaderContentAlignment="Center" props:VisibilityHelper.IsGroupCollapsed="False" HeaderTemplate="{StaticResource colHeaderTemplate}">
<dxg:GridColumn.EditSettings>
<dx:TextEditSettings HorizontalContentAlignment="Center"/>
</dxg:GridColumn.EditSettings>
</dxg:GridColumn>
The toggle button in the template must set a dependency property on the grid column. This works fine when the template is binding to a parent ie. the controls are nested,
I just can't figure out what I am doing wrong.
MSDN ref - http://msdn.microsoft.com/en-us/library/ms742882.aspx
One of the many SO posts about this - In WPF, why doesn't TemplateBinding work where Binding does?
Thank you
Right so I have found the solution. Firstly DataTemplate does work. As #Quercus, it is all in the binding to the correct control.
In my case not the GridColumn but the GridColumnHeader. So this
IsChecked="{Binding RelativeSource={RelativeSource AncestorType=dxg:GridColumnHeader}, Path=DataContext.(props:VisibilityHelper.IsGroupCollapsed)}"
works perfectly...when bound to the correct parent.
Also as #Quercus stated, the template is actually nested and that is why this works. I used a tool called Snoop which actually shows you the visual tree of the application and then the datacontext of the selected element. Using this I solved this issue as well as 2 others I was having.
I really hope this helps someone somewhere before everyone goes to MAUI or WinUI 3.
I'm planning to design an multiple file downloader app (similar to IDM or Transmission) for macOS based on Aria2 JSON-RPC and C# GUI via Xamarin.Mac. But there is a major issue for UI design. I need a UI control which is similar to "ListView" in XAML.
Basically it's something like in this topic discussed, i.e. I need something equivalent in Xamarin.Mac with this XAML code below:
<ListView x:Name="DownloadItemList">
<ListView.ItemTemplate>
<DataTemplate>
<StackPanel>
<TextBlock Text="{Binding DownloadItemTitle}"
Margin="20,0,20,8"
FontSize="24"
FontStyle="Italic"
FontWeight="SemiBold"
Foreground="DarkBlue" />
<TextBlock Text="{Binding DownloadProgressInfo}"
Margin="20,0,20,8"
FontSize="16"
Foreground="DarkGray"
Opacity="0.8" />
</StackPanel>
</DataTemplate>
</ListView.ItemTemplate>
</ListView>
I also need some data bindings in the UI code if possible. But so far I can't find any similar stuff in Xamarin.Mac. Is there any possible solution like this? Thanks in advance!
You can use NSTableView
static Content :
You can design cells from storyboard, and if required can modify content of these cells at runtime.
Dynamic Content : You can crate template cell at design time (or progrmmatically id requried ), give it identifier and use that cell multiple-time in tableviewd atasource.
You can use something like a table view
Hope this helps.
Link
Since the Anniversary Update (Build 14383 / 14393) you should be able to toggle the visibility of XAML elements without using a converter, like this:
<TextBlock Text="I'm not visible!" Visibility="{x:Bind IsVisibleFalse}" />
<TextBlock Text="I'm visible!" Visibility="{x:Bind IsVisibleTrue}" />
I was trying this in my project, minimum target version set to Windows 10 Anniversary Edition. Unfortunately I did not get it to work.
This code works just fine:
<StackPanel Visibility="{x:Bind ViewModel.IsUnlocked,
Converter={StaticResource BoolToVisibilityConverter}, Mode=TwoWay}">
This one doesn't (no error on compile, just does not show up when the bool value changes):
<StackPanel Visibility="{x:Bind ViewModel.IsUnlocked}>
I suspect the Mode="TwoWay" to be the issue, as you can't set it "when the binding expression ends with a cast". This code does not work as well:
<StackPanel Visibility="{x:Bind ViewModel.IsUnlocked,
Converter={StaticResource BoolToVisibilityConverter}>
So my question is: Am I misssing something or is this not working yet in a MVVM-Scenario and only with code-behind?
The default Mode is OneTime, which renders your code not working. I suggest you use OneWay, which should be usable upon casting.
Turns out x:Bind defaults to Mode=OneTime - I mistakenly thought it's Mode=OneWay.
So this does actually work:
<StackPanel Visibility="{x:Bind ViewModel.IsUnlocked, Mode=OneWay}>
I have a CustomListView that has controls like TextBoxes, HyperLinks and Buttons.
I can't share the exact Code, but please bear with me.
I have a list, say of type person with attributes like personHeight, personWidth, etc.
The binding to the list is done at the list level.
The issue is, that all values are fetched from the database, but only one is populated, the remaining are blank.
Also I didn't get any binding error in the Output Window. What could be the issue?
The general syntax of the XAML (where personHeight is one of the properties of the list object):
<CustomGridViewColumn SortOnProperty="personHeight">
<CustomGridViewColumn.SortableHeader>
<TextBlock Text="Person Height" />
</CustomGridViewColumn.SortableHeader>
<CustomGridViewColumn.CellTemplate>
<DataTemplate>
<TextBox x:Name="personHeightText" Text="{Binding personHeight}" />
</DataTemplate>
</CustomGridViewColumn.CellTemplate>
<CustomGridViewColumn>
The binding is done as follows:
<CustomListView ItemsSource="{Binding Path=Persons}"
ItemContainerStyle="{StaticResource MyExpandableListViewItemStyle}"
ExpandedDataTemplate="{StaticResource ExpandedDataTemplate}"
ScrollViewer.CanContentScroll="False"
x:Name="GridList">
I'm having a problem with the autocompletebox from the toolkit for windows phone. I bind it to some data, then when i press it and start typing, it discovers some items but they are displayed wrong (the list is shown separated from the box, and also if i click on any item, nothing happens. If i click where the item would be supposed to be (for example, right on the top of the box), then it gets selected. It looks like a rendering problem (bug?)) but perhaps i'm doing something wrong. Here's the code for the box :
<DataTemplate x:Key="DataTemplate1">
<ContentControl Content="{Binding Name}" Margin="8,7"/>
</DataTemplate>
<toolkit:AutoCompleteBox ItemsSource="{Binding}" x:Name="txtSelectValues" MinWidth="250" Margin="0,0,0,0" ItemTemplate="{StaticResource DataTemplate1}" VerticalAlignment="Top" />
Found it. It's a bug with the AutoCompleteBox. When inside a scrollviewer control, the dropdown gets messed up and displayed in an incorrect position
Its not just that is also to do with being placed inside of a Pivot/Panaroma as well as the scrollviewer, the silverlight gurus have stated they haven't a timeline for the fix for the Pivot control, and there is a nasty hack
http://silverlight.codeplex.com/workitem/7574
I think the answer might just be that you shouldn't be using a ContentControl directly used like this. Try using something like a TextBlock instead - e.g.:
<DataTemplate x:Key="DataTemplate1">
<TextBlock Text="{Binding Name}" Margin="8,7"/>
</DataTemplate>
If that's not the answer, then try pulling back to a simple example - especially removing all the Margin's, Width's, Alignment's, etc - then put them back in one-by-one to work out and understand what is causing the effect you are seeing.