WPF-Show ToolTip On ListGridview with Custom Style - wpf

I am New in WPF. I have used listview in my application below is XAML:-
<ListView x:Name="lstviewMeters" Grid.Row="2" ItemContainerStyle="{StaticResource MeterRowStyle}" Height="260" Margin="0,73,31,0" VerticalAlignment="Top" Width="597" AlternationCount="2" ItemsSource="{Binding}" HorizontalAlignment="Right">
<ListView.View>
<GridView >
<GridViewColumn Header="Feeder" Width="125" DisplayMemberBinding="{Binding MeterName}" >
<GridViewColumn.HeaderTemplate>
<DataTemplate>
<StackPanel Orientation="Horizontal">
<TextBlock Text="Feeder" Padding="9,4,3,3"/>
</StackPanel>
</DataTemplate>
</GridViewColumn.HeaderTemplate>
</GridViewColumn>
<GridViewColumn Header="ID" Width="120" DisplayMemberBinding="{Binding MeterID}">
<GridViewColumn.HeaderTemplate>
<DataTemplate>
<StackPanel Orientation="Horizontal">
<TextBlock Text="ID" Padding="9,4,3,3"/>
</StackPanel>
</DataTemplate>
</GridViewColumn.HeaderTemplate>
</GridViewColumn>
</GridViewColumn>
</GridView>
</ListView.View>
</ListView>
Now I want to Show ToolTip On Each Cell Of ListviewGridview. What is best way to Show Custom Style ToolTip On cell. I googled but not getting proper solution for the same
Is there any solutionfor the same

Create CellTemplate then add tooltip to TextBlock
<ListView x:Name="lstviewMeters" Grid.Row="2" ItemContainerStyle="{StaticResource MeterRowStyle}" Height="260" Margin="0,73,31,0" VerticalAlignment="Top" Width="597" AlternationCount="2" ItemsSource="{Binding}" HorizontalAlignment="Right">
<ListView.View>
<GridView >
<GridViewColumn Header="Feeder" Width="125">
<GridViewColumn.CellTemplate>
<DataTemplate >
<TextBlock Text="{Binding MeterName}" ToolTip="{Binding MeterName}"/>
</DataTemplate>
</GridViewColumn.CellTemplate>
<GridViewColumn.HeaderTemplate>
<DataTemplate>
<StackPanel Orientation="Horizontal">
<TextBlock Text="Feeder" Padding="9,4,3,3"/>
</StackPanel>
</DataTemplate>
</GridViewColumn.HeaderTemplate>
</GridViewColumn>
<GridViewColumn Header="ID" Width="120">
<GridViewColumn.CellTemplate>
<DataTemplate >
<TextBlock Text="{Binding MeterID}" ToolTip="{Binding MeterID}"/>
</DataTemplate>
</GridViewColumn.CellTemplate>
<GridViewColumn.HeaderTemplate>
<DataTemplate>
<StackPanel Orientation="Horizontal">
<TextBlock Text="ID" Padding="9,4,3,3"/>
</StackPanel>
</DataTemplate>
</GridViewColumn.HeaderTemplate>
</GridViewColumn>
</GridView>
</ListView.View>
</ListView>

Related

DataContext of parent

I am a newbie WPF. I need to acheive the following: I have a ModelView which contains Observable collection of class "Edata". Edata also contains another ObservableColelction of Class"eParams" which contains 4 properties.
now I have listbox which contains the list of Edata, and another listview which contains the params .
Every thing works fine. the challenge is the tool tip. I have in the Edata Class Property called AsStringToolTip. I use this property to give some hint to user and briefed info about the row where the mouse is over.
<ListBox x:Name="lbx1" Grid.Column="0" Grid.Row="1" ItemsSource="{Binding EData}" VerticalAlignment="Center" HorizontalAlignment="Center">
<ListBox.ItemsPanel>
<ItemsPanelTemplate>
<VirtualizingStackPanel VirtualizingPanel.VirtualizationMode="Recycling"/>
</ItemsPanelTemplate>
</ListBox.ItemsPanel>
<ListBox.ItemTemplate>
<DataTemplate>
<TextBlock Style="{StaticResource Description}" TextWrapping="Wrap">
<TextBlock.Text>
<MultiBinding StringFormat="{}{0} , {1}">
<Binding Path="Edata.category" />
<Binding Path="Edata.EId" />
</MultiBinding>
</TextBlock.Text>
</TextBlock>
</DataTemplate>
</ListBox.ItemTemplate>
</ListBox>
<!-- No Compar ListView -->
<ListView Grid.Column="1" Grid.Row="1" ItemsSource="{Binding SelectedItem.Edata.eparams ,ElementName=lbx1}" Grid.IsSharedSizeScope="True" >
<ListView.ItemsPanel>
<ItemsPanelTemplate>
<VirtualizingStackPanel VirtualizingPanel.VirtualizationMode="Recycling"/>
</ItemsPanelTemplate>
</ListView.ItemsPanel>
<ListView.View>
<GridView >
<GridViewColumn Header="Name" >
<GridViewColumn.CellTemplate>
<DataTemplate >
<StackPanel Orientation="Horizontal" >
<TextBlock Text="{Binding Name}">
<TextBlock.ToolTip>
**<TextBlock DataContext="{Binding SelectedValue,ElementName=lbx1}" Text="{Binding Path=AsStringToolTip}">**
</TextBlock>
</TextBlock.ToolTip>
</TextBlock>
</StackPanel>
</DataTemplate>
</GridViewColumn.CellTemplate>
</GridViewColumn>
<GridViewColumn Header="ValueString" >
<GridViewColumn.CellTemplate>
<DataTemplate>
<StackPanel Orientation="Horizontal" >
<TextBlock Text="{Binding ValueString}" />
</StackPanel>
</DataTemplate>
</GridViewColumn.CellTemplate>
</GridViewColumn>
<GridViewColumn Header="value" >
<GridViewColumn.CellTemplate>
<DataTemplate>
<StackPanel Orientation="Horizontal">
<TextBlock Text="{Binding value}" />
</StackPanel>
</DataTemplate>
</GridViewColumn.CellTemplate>
</GridViewColumn>
<GridViewColumn Header="paramtype">
<GridViewColumn.CellTemplate>
<DataTemplate>
<StackPanel Orientation="Horizontal">
<TextBlock Text="{Binding paramtype}" />
</StackPanel>
</DataTemplate>
</GridViewColumn.CellTemplate>
</GridViewColumn>
</GridView>
</ListView.View>
</ListView>
I hope I am clear enough. any Advise. Currently the tool tip shows nothing!!!
Since the Tooltip resides in its own visual tree it cannot find the ListBox when the binding is evaluated.
But you could bind the Tag property of the TextBlock to the ListBox and then bind the element in the Tooltip to the PlacementTarget of the ToolTip itself. It's probably better explained with some sample markup:
<GridViewColumn Header="Name" >
<GridViewColumn.CellTemplate>
<DataTemplate >
<StackPanel Orientation="Horizontal" >
<TextBlock Text="Name" Tag="{Binding ElementName=lbx1}">
<TextBlock.ToolTip>
<ToolTip>
<TextBlock Text="{Binding PlacementTarget.Tag.SelectedItem.AsStringToolTip,
RelativeSource={RelativeSource AncestorType=ToolTip}}" />
</ToolTip>
</TextBlock.ToolTip>
</TextBlock>
</StackPanel>
</DataTemplate>
</GridViewColumn.CellTemplate>
</GridViewColumn>
The PlacementTarget in the binding path refers to the "Name" TextBlock.
The Tag property of this TextBlock returns a reference to the "lbx1" ListBox.
You can then get the AsStringToolTip property of the currently selected Edata object.

Getting user input from listview

I created a listview. I need to get the user's input from the Textbox inside the listview. When user click on submit button User input from listview are displayed in a MessageBox. How to get user input from textbox inside the listview
<ListView x:Name="lstvQualification"
Height="96"
Margin="10,6,14,0"
VerticalAlignment="Top">
<ListView.View>
<GridView>
<GridViewColumn Width="249" Header="Education">
<GridViewColumn.CellTemplate>
<DataTemplate>
<StackPanel Orientation="Horizontal">
<TextBox x:Name="txtEducation"
Width="247"
Text="{Binding education}" />
</StackPanel>
</DataTemplate>
</GridViewColumn.CellTemplate>
</GridViewColumn>
<GridViewColumn Width="253" Header="College/Institution">
<GridViewColumn.CellTemplate>
<DataTemplate>
<StackPanel Orientation="Horizontal">
<TextBox x:Name="txtCollege"
Width="251"
Text="{Binding college}" />
</StackPanel>
</DataTemplate>
</GridViewColumn.CellTemplate>
</GridViewColumn>
<GridViewColumn Width="88" Header="Mark(%)">
<GridViewColumn.CellTemplate>
<DataTemplate>
<StackPanel Orientation="Horizontal">
<TextBox x:Name="txtMark"
Width="86"
Text="{Binding mark}" />
</StackPanel>
</DataTemplate>
</GridViewColumn.CellTemplate>
</GridViewColumn>
<GridViewColumn Width="88" Header="Add">
<GridViewColumn.CellTemplate>
<DataTemplate>
<StackPanel Orientation="Horizontal">
<Button x:Name="btnAddQualification"
Click="btnAddQualification_Click"
Content="Add"
Style="{StaticResource NewImg}" />
</StackPanel>
</DataTemplate>
</GridViewColumn.CellTemplate>
</GridViewColumn>
</GridView>
</ListView.View>
</ListView>
<Button Content="Submit" x:name="submit" />
This could be the example for change in your code to work fine:
<ListView x:Name="myListView"
HorizontalAlignment="Stretch"
ItemsSource="{Binding Source={StaticResource myCollectionViewSource},XPath='Party',Mode=TwoWay}">
<ListView.View>
<GridView>
<GridViewColumn Width="100" DisplayMemberBinding="{Binding XPath='Contact'}" Header="Contact"/>
<GridViewColumn DisplayMemberBinding="{Binding XPath='Qty'}" Header="Q"/>
<GridViewColumn DisplayMemberBinding="{Binding XPath='Amount'}" Header="Amt"/>
<GridViewColumn x:Name="tbTot" Header="Tot">
<GridViewColumn.CellTemplate>
<DataTemplate>
<DockPanel>
<TextBox LostFocus="TextBox_LostFocus" Width="100" Text="{Binding XPath='Text'}" />
</DockPanel>
</DataTemplate>
</GridViewColumn.CellTemplate>
</GridViewColumn>
</GridView>
</ListView.View>
</ListView>
You already use {Binding ...} everywhere in the cell templates, those bindings are TwoWay by default, so any user input would/should automatically be passed to underlying data objects. However, I don't see any binding on ListView.ItemsSource property, so most probably you forgot to prepare the dataobjects. Create a collection of dataitems, bind them to the ItemsSource, let the ListView display them and celltemplates with bindings should update the dataitems' properties with no extra work from your side. When submit is pressed, just check the collection of dataitems, all the data entered should be already there (assuming you made all models and bindings properly).

WPF ListView multi columns row

I have this model:
Public Data
{
string name;
string age;
string id;
DateTime time;
}
Currently each ListView row contains all this 4 peoperties:
<ListView.View>
<GridViewColumn Width="20" DisplayMemberBinding="{Binding Index}" />
<GridViewColumn Width="320" DisplayMemberBinding="{Binding Description}" />
<GridViewColumn Width="150" DisplayMemberBinding="{Binding IPAddress}" />
<GridViewColumn Width="150" DisplayMemberBinding="{Binding time}" />
</GridView>
</ListView.View>
Now i want to make this ListView Width smaller so i want to each Row will contain 2 columns with 2 properties on each of them.
Is it possible ?
You need to override the default CellTemplate of GridViewColumn inorder to display your results inside a ListView.View
<GridViewColumn >
<GridViewColumn.CellTemplate>
<DataTemplate>
<StackPanel Orientation="Vertical">
<TextBlock Text="{Binding Index}" />
<TextBlock Text="{Binding Description}"/>
</StackPanel>
</DataTemplate>
</GridViewColumn.CellTemplate>
</GridViewColumn>
<GridViewColumn >
<GridViewColumn.CellTemplate>
<DataTemplate>
<StackPanel Orientation="Vertical">
<TextBlock Text="{Binding IPAddress}" />
<TextBlock Text="{Binding time}"/>
</StackPanel>
</DataTemplate>
</GridViewColumn.CellTemplate>
</GridViewColumn>
Don't use a ListView
Use a ListBox DataTemplate with a Grid

How to set ListView selection from the template element that has focus?

I have a ListView that uses data templates to display specific controls within the cells:
<ListView Grid.Row="1" ItemsSource="{Binding Ratings}" SelectedItem="{Binding SelectedRating}" Margin="5" MinHeight="50" SelectionMode="Single" ScrollViewer.CanContentScroll="True"
local:GridViewSort.Enable="True">
<ListView.View>
<GridView>
<GridViewColumn Header="Date" local:GridViewSort.PropertyName="RatingDate">
<GridViewColumn.CellTemplate>
<DataTemplate>
<DatePicker SelectedDate="{Binding RatingDate}"/>
</DataTemplate>
</GridViewColumn.CellTemplate>
</GridViewColumn>
<GridViewColumn Header="Rating ID" local:GridViewSort.PropertyName="RatingID">
<GridViewColumn.CellTemplate>
<DataTemplate>
<TextBox Text="{Binding RatingID}" Width="35" />
</DataTemplate>
</GridViewColumn.CellTemplate>
</GridViewColumn>
<GridViewColumn Header="Name" local:GridViewSort.PropertyName="RatingName">
<GridViewColumn.CellTemplate>
<DataTemplate>
<TextBox Text="{Binding RatingName}" Width="35" />
</DataTemplate>
</GridViewColumn.CellTemplate>
</GridViewColumn>
<GridViewColumn Header="Age" local:GridViewSort.PropertyName="RatingAge">
<GridViewColumn.CellTemplate>
<DataTemplate>
<StackPanel Orientation="Horizontal">
<TextBox Text="{Binding RatingAge}" Width="35" />
<TextBlock Text=" yrs"/>
</StackPanel>
</DataTemplate>
</GridViewColumn.CellTemplate>
</GridViewColumn>
</GridView>
</ListView.View>
</ListView>
I also have a delete button to remove the selected row.
My user has a habit of clicking into to the edit and date controls (which doesn't change the selected row) and then hitting delete to remove the row he has clicked on. Unfortunately, this deletes the wrong row.
How can I change the row selection whenever the user clicks into the controls?
You can use PreviewMouseUp event on a ListViewItem:
<ListView Grid.Row="1" ItemsSource="{Binding Ratings}" SelectedItem="{Binding SelectedRating}" Margin="5" MinHeight="50" SelectionMode="Single" ScrollViewer.CanContentScroll="True"
local:GridViewSort.Enable="True">
<ListView.Resources>
<Style TargetType="{x:Type ListViewItem}">
<EventSetter Event="PreviewMouseUp" Handler="ListViewItem_PreviewMouseUp" />
</Style>
</ListView.Resources>
<ListView.View>
<GridView>
...
Code behind:
private void ListViewItem_PreviewMouseUp(object sender, MouseButtonEventArgs e)
{
var listViewItem = sender as ListViewItem;
if (listViewItem != null)
{
listViewItem.IsSelected = true;
}
}

require to change the dropdown item for other row's dropdown item in wpf

i have a list view with the following code
<ListView Name="configurationModeGrid" Width="400" Margin="236,440,58,143" BorderBrush="Black" FontFamily="Microsoft Sans Serif" FontSize="11">
<ListView.View>
<GridView>
<GridView.Columns>
<GridViewColumn Width="110" Header="Network">
<GridViewColumn.CellTemplate>
<DataTemplate>
<TextBox Margin="-5,0,-5,0" Name="NetworkName" Height="20" Width="108" Text="{Binding NetworkName, Mode=OneWay}" Background="#FFFFCAA6" HorizontalAlignment="Left" Style="{StaticResource DisableText}" />
</DataTemplate>
</GridViewColumn.CellTemplate>
</GridViewColumn>
<GridViewColumn Width="110" Header="Trend Mode">
<GridViewColumn.CellTemplate>
<DataTemplate>
<ComboBox Name="TrendListItems" Margin="-5,0,-5,0" Width="108" ItemsSource="{Binding TrendModeList}" SelectedItem="{Binding CurrentMode}" HorizontalAlignment="Left" Style="{StaticResource ListBoxCombo}" SelectionChanged="TrendListItems_SelectionChanged" >
</ComboBox>
</DataTemplate>
</GridViewColumn.CellTemplate>
</GridViewColumn>
<GridViewColumn Header="LAN" Width="50">
<GridViewColumn.CellTemplate>
<DataTemplate>
<TextBox Name="LanNumber" Margin="-5,0,-5,0" Width="48" Text="{Binding LanNumber,Mode=OneWay}" IsEnabled="False" Background="#FFFFCAA6" HorizontalAlignment="Left" Style="{StaticResource DisableText}"/>
</DataTemplate>
</GridViewColumn.CellTemplate>
</GridViewColumn>
<GridViewColumn Header="Label" Width="100">
<GridViewColumn.CellTemplate>
<DataTemplate>
<TextBox Name="LanLabel" Margin="-5,0,-5,0" Width="98" Text="{Binding LanLabel, Mode=OneWay}" Background="#FFFFCAA6" HorizontalAlignment="Left" />
</DataTemplate>
</GridViewColumn.CellTemplate>
</GridViewColumn>
</GridView.Columns>
</GridView>
</ListView.View>
</ListView>
The dropdown list will bind the following options
i) internetwork
II) lan
iii) none
Question
if the lan item in dropdownlist is selected from the row one of list view, i would like to make other other dropdownlist item's item must become none.
Can this be done using WPF UI or have to use only data model for this?

Resources