We Keep Coding

Display list of controls with fluid width in wpf

I've created panel which displays controls. However I want the list of controls to always fit the width of the window. Similar to how visual studios Properties panel works. I'm assuming by using listbox I'll automatically inherit the scrollbar when the controls become lengthy.
What i have now on the left and the goal on the right.
This is visual studios.
My code behind looks like this...
<ListBox Grid.Column="0" x:Name="AssetList" ItemsSource="{Binding Attributes}" SelectionMode="Extended">
<ListBox.Resources>
<DataTemplate DataType="{x:Type model:IntAttr}">
<WrapPanel>
<TextBlock Text="{Binding Key}" Foreground="Blue"></TextBlock>
<TextBlock Text=" "></TextBlock>
<TextBlock Text="{Binding Value}"></TextBlock>
</WrapPanel>
</DataTemplate>
</ListBox.Resources>
</ListBox>

Solution:
<ListBox HorizontalAlignment="Stretch"
HorizontalContentAlignment="Stretch"
ScrollViewer.VerticalScrollBarVisibility="Visible"
Grid.Column="0"
x:Name="AssetList"
ItemsSource="{Binding Attributes}"
SelectionMode="Extended">....

ScrollView not working in Windows 10

I have a ViewModel with about 200 contacts and I am binding it to a ListView
<Grid>
<ScrollViewer
HorizontalScrollBarVisibility="Auto"
VerticalScrollBarVisibility="Auto">
<ListView x:Name="ContactListing" ItemsSource="{Binding ContactListing}" >
<ListView.ItemTemplate>
<DataTemplate>
<StackPanel Orientation="Horizontal">
<TextBlock Text="{Binding Path=DisplayName}" />
<Image Source="{Binding Thumbnail,Converter={StaticResource ResourceKey=contactConv}}" />
</StackPanel>
</DataTemplate>
</ListView.ItemTemplate>
</ListView>
</ScrollViewer>
</Grid>
Would be great if someone could explain the details behind the ScrollViewers visibility

A ListView control already contains a ScrollViewer and implements scrolling based on the amount of items, there is no need to wrap this control in another ScrollViewer. You can double check this in the default ControlTemplate of ListView at line 6219 in the generic.xaml file containing all Windows 10 styles:
C:\Program Files (x86)\Windows Kits\10\DesignTime\CommonConfiguration\Neutral\UAP\10.0.10240.0\Generic\generic.xaml
So you simply have to remove the ScrollViewer from your XAML fragment.
<Grid>
<ListView x:Name="ContactListing" ItemsSource="{Binding ContactListing}" >
<ListView.ItemTemplate>
<DataTemplate>
<StackPanel Orientation="Horizontal">
<TextBlock Text="{Binding Path=DisplayName}" />
<Image Source="{Binding Thumbnail,Converter={StaticResource ResourceKey=contactConv}}" />
</StackPanel>
</DataTemplate>
</ListView.ItemTemplate>
</ListView>
</Grid>
Note: As you're using a ListView, I suppose you want all your items stacked above each other. If you want multiple columns to show your items, use a GridView instead.

Listview in WinRT using C#

I want my ListView to display the items in a group horizontally as displayed in the image below. I could not find anything relating to this online. This screen was taken from the Groove music application. Since I am new to asking questions here it seems I don't have enough reputation to post images therefore I provided a link to the image in question sorry for the inconvenience.
http://i.imgur.com/boCK9iy.png
Edit:
I am trying to imitate the groove music player for a school project this link below shows my app. Hopefully this give you a better idea of the problem.
http://i.imgur.com/vPJ13Sc.png
My Xaml Code:
<ListView
x:Name="itemGridView"
Grid.Row="1"
ItemsSource="{Binding Source={StaticResource artistsItemsViewSource}}"
SelectionMode="None"
IsSwipeEnabled="false"
IsItemClickEnabled="True"
RequestedTheme="Light">
<ListView.ItemTemplate>
<DataTemplate>
<StackPanel MaxWidth="200">
<Ellipse Height="150" Width="150">
<Ellipse.Fill>
<ImageBrush Stretch="Fill" ImageSource="Assets/Artist.png"/>
</Ellipse.Fill>
</Ellipse>
<TextBlock Text="{Binding ArtistName}" FontSize="18" HorizontalAlignment="Center" Margin="0,5,0,0" TextWrapping="Wrap"/>
<TextBlock Text="{Binding AlbumCount}" FontSize="15" HorizontalAlignment="Center" Margin="0"/>
</StackPanel>
</DataTemplate>
</ListView.ItemTemplate>
<ListView.ItemsPanel>
<ItemsPanelTemplate>
<ItemsStackPanel Width="200" HorizontalAlignment="Left" Margin="30,0,0,0"/>
</ItemsPanelTemplate>
</ListView.ItemsPanel>
<ListView.GroupStyle>
<GroupStyle>
<GroupStyle.HeaderTemplate>
<DataTemplate>
<Grid Margin="0,0,0,2">
<TextBlock Text="{Binding AlphaLetter}" FontSize="20" Foreground="{StaticResource SideButtonBlue}" />
</Grid>
</DataTemplate>
</GroupStyle.HeaderTemplate>
</GroupStyle>
</ListView.GroupStyle>
</ListView>

I think you can change the view in the listview settings to LargeIcon and then you can set Icons for each value in your listview.
But you could maybe use the ObjectListView its better than the plain ListView and you have more functions. check this out: click
I found something similar on the site of the objectlistview: here

for horizontal placement of the elements in ListView do this:
<ItemsStackPanel
Orientation="Horizontal" />
also, remove Width="200"
also you can use GridView instead of ListView

Windows 8.1 c# xaml - change background colour of stackpanel onBind

I am binding ObservableCollection<MyClass> to a gridview, but I need to change the background colour of a stackpanel within that GridView.ItemTemplate when a value exists in ObservableCollection<MyOtherClass>.
I have reviewed several tutorials (example) and question on this subject but none have helped. I have also tried binding the data to the gridview then looping through that gridview using gv.Items and access the stackpanel that way, obviously I have failed.
What is the best way to achieve my desired outcome?
<GridView x:Name="gv" Margin="30,0,0,0" ItemClick="gv_ItemClick" Holding="itemGridView_Holding" SelectionMode="None" IsItemClickEnabled="True" >
<GridView.ItemTemplate>
<DataTemplate>
<GridViewItem >
<!--<Grid>-->
<StackPanel x:Name="spJobDisplay" Width="350" Background="White" >
<Image Source="{Binding Images[0].Source}" />
<StackPanel>
<TextBlock Text="{Binding SelectedSupplier.SupplierName}" Margin="10,0,0,0" Foreground="Black"></TextBlock>
</StackPanel>
</StackPanel>
<!--</Grid>-->
</GridViewItem>
</DataTemplate>
</GridView.ItemTemplate>
</GridView>
As you can see above I have set spJobDisplay stackPanel to white. It is that which I would like to to changed based on values in ObservableCollection<MyOtherClass>

Customize Panorama List in Windows Phone 8 Xaml

Customize Panorama List in Windows Phone 8 Xaml
I am developing windows phone 8 book reader application. I am using panorama list to load pages. Because of its default style panorama shows part of another page in the same view.I need to show single page in single view and it should fit.Any help?

You can Pivot control. It shows one view on one page.

I think it is not possible in panorama control but you can use horizontal list
<Grid x:Name="ContentPanel" Grid.Row="1" Margin="12,0,12,0">
<tolkit:GestureService.GestureListener>
<tolkit:GestureListener Flick="GestureListener_Flick"></tolkit:GestureListener>
</tolkit:GestureService.GestureListener>
<ListBox Name="lstMyList" ScrollViewer.HorizontalScrollBarVisibility="Hidden" ScrollViewer.VerticalScrollBarVisibility="Disabled" HorizontalAlignment="Left" SelectionChanged="lstlstMyList_SelectionChanged_1">
<ListBox.ItemsPanel>
<ItemsPanelTemplate>
<StackPanel Orientation="Horizontal"/>
</ItemsPanelTemplate>
</ListBox.ItemsPanel>
<ListBox.ItemTemplate>
<DataTemplate>
<StackPanel Orientation="Vertical">
<Image Height="480" Width="500" Margin="-25,30,0,0" Source="{Binding Image}"/>
<TextBlock Name="txbMainHeading" Text="{Binding Message}" Margin="80,10,0,0" FontSize="26" FontWeight="Medium" Foreground="#cc6600"></TextBlock>
<TextBlock Text="{Binding Description}" Margin="60,0,0,0" FontSize="18" Foreground="Black" TextWrapping="Wrap" Width="350"></TextBlock>
</StackPanel>
</DataTemplate>
</ListBox.ItemTemplate>
</ListBox>
</Grid>