I have a simple RadDataGrid
<grid:RadDataGrid ItemsSource="{x:Bind ViewModel.datarows}"
AutoGenerateColumns="False">
<grid:RadDataGrid.Columns>
<grid:DataGridTextColumn PropertyName="testcolumn" Header="a very long header name" />
</grid:RadDataGrid.Columns>
</grid:RadDataGrid>
I would like to wrap the column header text, to fit within a specific width. You can specify the column width in the DataGridTextColumn headerstyle but i dont see any way of wrapping the text. Does anyone know how this can be done?
Thanks
This turned out to be easy.
You can do something like this :
<grid:DataGridTextColumn PropertyName="AccessCat">
<grid:DataGridTextColumn.Header>
<TextBlock>
<TextBlock.Inlines>
<Run Text="Access"/>
<LineBreak/>
<Run Text="cat."/>
</TextBlock.Inlines>
</TextBlock>
</grid:DataGridTextColumn.Header>
</grid:DataGridTextColumn>
Related
does anyone know how to set text of textbox in vertical center of the box? I'm trying to make my universal app responsive, and textbox size adapts as it should, but I would need text in to be always in vertical center.
Thanks for all your time and help in advance!
My code:
<TextBox
x:Name="textBox"
Margin="10"
TextWrapping="Wrap"
Text=""
Grid.Column="1"
PlaceholderText="Website"
TextAlignment="DetectFromContent"
FontSize="20"
FontFamily="Segoe UI Light"
VerticalContentAlignment="Center"
d:LayoutOverrides="TopPosition, BottomPosition" />
There's a little more to it than that. Inside the template for TextBox are several elements. Including presenters for the placeholder text and a delete button etc.
You could add an attached property to target the embedded ScrollViewer and achieve most of what you want like this;
<TextBox ScrollViewer.VerticalContentAlignment="Center" ..../>
Except if you're using placeholder "watermark" text and stuff, you may have to make a copy of the template and vertical position everything in there.
Hope this helps, cheers.
Does anyone know how to use the DevExpress DXTabControl in XAML and set it up so that the tabs appear at the bottom? Here is what I have so far but the tabs show up at the top. The DevExpress documentation does not have an example of this. Intellisense does not give me anything intuitive.
<dx:DXTabControl>
<dx:DXTabItem Header="Main">
<dxdo:DockLayoutManager>
<dxdo:LayoutGroup>
<dxdo:LayoutPanel Caption="TaskList">
<views:DxTaskList x:Name="Tasklst" />
</dxdo:LayoutPanel>
<dxdo:LayoutPanel Caption="TaskDetails">
<ScrollViewer VerticalScrollBarVisibility="Auto" HorizontalScrollBarVisibility="Auto" Focusable="False">
<StackPanel>
<views:TaskDetails x:Name="TaskDtls"/>
</StackPanel>
</ScrollViewer>
</dxdo:LayoutPanel>
</dxdo:LayoutGroup>
</dxdo:DockLayoutManager>
</dx:DXTabItem>
</dx:DXTabControl>
For anyone who might be stumped at something not-so-obvious, here is the XAML solution I was looking for. Yes, the property was obviously called HeaderLocation but DevExpress' documentation does not give any XAML examples on this. So here is what I came up with that solved my case:
<dx:DXTabControl>
<dx:DXTabControl.View>
<dx:TabControlMultiLineView HeaderLocation="Bottom"/>
</dx:DXTabControl.View>
<dx:DXTabItem Header="Main">
<dxdo:DockLayoutManager>
<dxdo:LayoutGroup>
<dxdo:LayoutPanel Caption="TaskList">
<views:DxTaskList x:Name="Tasklst" />
</dxdo:LayoutPanel>
<dxdo:LayoutPanel Caption="TaskDetails">
<ScrollViewer VerticalScrollBarVisibility="Auto" HorizontalScrollBarVisibility="Auto" Focusable="False">
<StackPanel>
<views:TaskDetails x:Name="TaskDtls"/>
</StackPanel>
</ScrollViewer>
</dxdo:LayoutPanel>
</dxdo:LayoutGroup>
</dxdo:DockLayoutManager>
</dx:DXTabItem>
</dx:DXTabControl>
As you can see you're supposed to add the View property and then assign it a value, which I used a TabControlMultiLineView, and that object had a HeaderLocation property to which I set it to one of the valid enums. When I did this, the tabs appeared at the bottom.
I'm new to windows mobile apps.
I have a pivot page and inside that there is multiple pivot items.
Inside the pivot item there is list picker which values are hard coded.
If there is more items in list picker all items show in a new page by default.
My issue is since all the item font are too small when opening the screen.
How can I change the font size of list picker items when those are opening.
My code like this.
<toolkit:ListPicker Grid.Row="0" Grid.Column="2" FontSize="21" Header="" Margin="10,12,-157,12" Background="White" Foreground="Black" BorderThickness="1" >
<sys:String>Convenience Eateries (CE)</sys:String>
<sys:String>Grocery Store (GS)</sys:String>
<sys:String>Secondary Network-ASD</sys:String>
<sys:String>Secondary Network-PSD</sys:String>
<sys:String>Cash and Carry</sys:String>
<sys:String>Modern Trade-Convenience Organized</sys:String>
<sys:String>Modern Trade-Grocery independent(SMMT)</sys:String>
<sys:String>HoReCa-Leisure outlets</sys:String>
<sys:String>HoReCa-Sports Clubs</sys:String>
<sys:String>HoReCa-Night Clubs</sys:String>
<sys:String>HoReCa-Karaoke</sys:String>
<sys:String>HoReCa-Casino</sys:String>
<sys:String>HoReCa-Café and Restaurant/Pubs</sys:String>
<sys:String>HoReCa-Other</sys:String>
<sys:String>Military-Welfare Shop</sys:String>
<sys:String>Military-Canteen</sys:String>
<sys:String>Convenience Mobile Outlets</sys:String>
<sys:String>Unconventional Outlets-Wine Stores</sys:String>
<sys:String>Unconventional Outlets-Other</sys:String>
</toolkit:ListPicker>
Try using ListPickerItem children instead of strings. They should have a better default look than shown above:
<toolkit:ListPicker>
<toolkit:ListPickerItem>Bob</toolkit:ListPickerItem>
<toolkit:ListPickerItem>Betty</toolkit:ListPickerItem>
<toolkit:ListPickerItem>Frank</toolkit:ListPickerItem>
<toolkit:ListPickerItem>Frank</toolkit:ListPickerItem>
</toolkit:ListPicker>
To change how the items look in the full mode page, you need to change the ListPicker's FullModeItemTemplate property. Something like this:
<toolkit:ListPicker>
<toolkit:ListPicker.FullModeItemTemplate>
<DataTemplate>
<TextBlock Text="{Binding}" FontSize="25" />
</DataTemplate>
</toolkit:ListPicker.FullModeItemTemplate>
<sys:String>Convenience Eateries (CE)</sys:String>
<sys:String>Grocery Store (GS)</sys:String>
<!-- Hard coded values go here, just as in your code. -->
</toolkit:ListPicker>
Background
I'm trying to put a textBlock control at the bottom of the screen (with a small margin below it), and I also wish to set a background for it, so that no matter what is shown behind the textBlock, it will be easy to read.
On Android, you could simply set the background to it, and tell it to have the width and height to be WRAP_CONTENT, so that it will take only the space it needs, but I can't find a similar thing on WP8.
Current status
This is the xaml I've created:
...
<Grid >
<Image x:Name="fullScreenImage" Stretch="Fill"
Visibility="Collapsed" />
<TextBlock HorizontalAlignment="Center" VerticalAlignment="Bottom"
Margin="0,0,0,200" FontSize="40" x:Name="pictureLabel" TextWrapping="Wrap"
Foreground="#ff000000" />
</Grid>
The problem
Since the textBlock doesn't have a background property, I had to use something that wraps it. However, since its content changes dynamically, I can't simply set a size for it.
The question
For now, I would like to simply set its background color.
I would also very appreciate if it would be possible to use a rounded corners rectangle for the background, or a 9-patch image.
How can I achieve setting a background for the textBlock?
The solution is very simple. Just set the HirizontalAlignment to Left. Hope this will work in your case.
<StackPanel HorizontalAlignment="Left">
<Border Background="#66FFFFFF">
<TextBlock/>
</Border>
</StackPanel>
According to this question (which is for Silverlight - but is xaml nonetheless), there is no way to explicitly set a background color for a TextBlock. Your best bet is to wrap your TextBlock in a Grid or Border.
If a Grid does not work, this article suggests a Border will do the trick:
A simple border will do, and by not setting its width and height
properties, it will shrink/grow based on the size of the TextBlock.
I've come up with the next solution , which works quite fine , but what i really would like to also have is a way to set a min font and max font size , so that if there is a single word , the font might need to be of some size, and if the text is too long , the font will be of a smaller size , all in a dynamic way.
code:
label.Text = label;
label.Measure(new Size(RenderSize.Width, RenderSize.Height));
border.Width = label.DesiredSize.Width + border.Padding.Left + border.Padding.Right + border.BorderThickness.Left + border.BorderThickness.Right;
border.Height = label.DesiredSize.Height + border.Padding.Top + border.Padding.Bottom + border.BorderThickness.Bottom + border.BorderThickness.Top;
and the xaml:
<Border BorderBrush="#ff000000" BorderThickness="2" CornerRadius="8" Visibility="Collapsed" Padding="5" Background="#bfff0000" Margin="10,0,10,200" VerticalAlignment="Bottom" x:Name="border">
<StackPanel>
<TextBlock FontSize="40" x:Name="pictureLabel" TextWrapping="Wrap" Foreground="#ff000000" />
</StackPanel>
</Border>
How would I set the number of characters a user is allowed to input in a TextBlock in xaml?
Would I do it on the Model or create some sort of custom attribute to handle it?
TextBlock doesn't have a MaxLength, neither does Label. TextBox does. Users cannot input into a TextBlock unless you have modified it.
Is it really a TextBlock you want to limit or did you mean a TextBox? If it is a TextBox you can simply use the MaxLength property.
<TextBox Name="textBox1" MaxLength="5" />
If it really is a TextBlock you are using and somehow allowing a user to input data into it, then switch to use a TextBox. If it is the TextBlock style you are after, you can style the TextBox to look like a TextBlock.
Without creating a custom control, you have a few options.
You could try to size the TextBlock to fit your expected text exactly, but that gets ugly fast trying to account for varying input or different font sizes.
Instead, you can verify the character length of the string to be assigned to the TextBlock.Text property and limit it if necessary.
string s = "new text";
if (s.Length > maxLen)
textBlock1.Text = s.Substring(0, maxLen);
else
textBlock1.Text = s;
Another option is to use the TextWrapping and TextTrimming properties. The following attributes could be added to your TextBlock xaml to add line wrapping and "..." to denote that text exists beyond the size of the TextBlock.
<TextBlock ... TextWrapping="Wrap" TextTrimming="CharacterEllipsis" />
You can use 'TextTrimming' Property of a Textblock. Set TextTrimming = "CharacterEllipsis". You might need to play with Width to manage how many characters you really want to display.
<TextBlock TextTrimming="CharacterEllipsis" Text="{Binding Subject}"/>
Either Set MaxHeight = "SomeHeight" and trim the overflow with
<TextBlock TextTrimming="CharacterEllipsis" Text="{Binding LongText}"
Or Use TextBox like Textblock by setting
<TextBox IsReadOnly="True" Background="Transparent" BorderThickness="0"
MaxLength="100"