Accueil > Non classé > ListView Columns Arrange, Sort, Filter, Save with no code behind

ListView Columns Arrange, Sort, Filter, Save with no code behind

29/03/2022 admin Commenter Allez aux commentaires

Warning

Filter sort are not tested with set of big data

For using this, load and see project below (visual studio 2022/ .net 6.0)

Components

For using then you can add to yours <GridView> the two controls

local:GridViewColumnEx overrided from GridViewColumn
local:GridViewColumnHeaderEx overrided from GridViewColumnHeader

properties for both

Properties	Descriptions
CanFilter	define column has filter [default = false] if set to true, filter icon is visible when FilterEditor is correct for datatype
CanSort	define column can sorted [default =false]
CanResize	define column can resized [default = true] if set to false, the separator of column is black
CanHide	define column can hided [default = false] if set to true, hide iconis visible
CanMove	define column can moved [default = true] if set to false, DisableMoveColor is applyed
Profil	define profil for column (see profils) [default = empty]
FilterEditor	Define editor used for filtering (see Editor)
ColumnBindingName	Define name of binding of trade object (no necessary to use DisplayMemberBinding)
HorizontalContentAlignment	Define position of header in column header (right, center, left) [default = left] right center Left
HideToolTip	ToolTip text for hide icon [default = « Hide column »]
FilterToolTip	ToolTip text for filter icon [default = « Filter column »]
DisableMoveColor	Disable move color for header when CanMove = false [default = #10000000]
FilterIndicatorColor	Color of filter icon when filter exists [default = Green]
MinColumnWidth	Minimum size for header [default = 50d]

properties for local:GridViewColumnEx

Properties	Descriptions
Header	from GridViewColumn with same usage

propertie for local:GridViewColumnHeaderEx

Properties	Descriptions
Content	from GridViewColumnHeader with same usage

Structure

You can use

only GridViewColumnEx
GridViewColumnEx with CellTemplate
GridViewColumn with GridViewColumnHeaderEx inside
GridViewColumn with CellTemplate and GridViewColumnHeaderEx inside

see MainWindowStructure.xaml for sample

Editors

the editors are those which make it possible to filter the elements in columns. You can choose for a data type in the column the type of editor you want to have (and behavior)
it set in EditorFilter property (with flag enum) set with ‘,’

Data type	Description
Integer	See MainWindowInteger.xaml for sample
String	See MainWindowString.xaml for sample
Boolean	See MainWindowBool.xaml for sample
DateTime	See MainWindowDate.xaml for sample
Enum	See MainWindowEnum for sample for enum you can use a TypeConverter for showing value as you want see in trade.cs enum EStatus and TypeConverter EStatusConverter

You can see sample in MainWindowEditor.xaml for mixing data and editor

You can also define your own editor by redefining the data model for the editor based on Datatype you can find a the end of generic.xaml.
Classes of editor override from BaseFilter (see in FilterClasses.cs)
For sample you can see MainWindowDesign.xaml (in windows resources for redefine)

Profils

the profiles are made to quickly define a presentation by hiding the columns which have at least one profil and whose profile is or is not in the selected one.

for sample if you have columns A, B, C, D (profils are set by string separate by ‘,‘)

Column	Profil
A	(empty or not define)
B	alpha,beta
C	beta,gamma
D	alpha,gamma

If you set profil to

Profil	Columns showed
alpha	A (no profile define) B D
beta	A (no profile define) B C
gamma	A (no profile define) C D

To have a better presentation of the profiles you can add a converter to have personalized viewed texts
for sample i transmform in a converter a,b,c profils text to alpha, beta, gamma texts
with attached property local:ProfilHelper.Converter set in ListView
see ProfilTextConverter.cs

Like local:ProfilHelper.Converter= »{local:ProfilTextConverter} » see in MainWindowProfil.xaml

Other

ContextMenus

You can have 3 context menu on columns by clicking right on GridViewColumnsHeader

Normal context menu (right click) for showing colums can hide or show (disabled columns mean are not in selected profil), if one or least has filter show menu item for clear all filter, if current collumn has filter show menu item for clear this filter, and show current profil if exists

View profil context menu (right click + shift) view all columns with associated profil (translate by converter if exists)

Select profil context menu (right click + ctrl) for selected profil, if a profil is already set you have a menu item for clear this (selected profil is checked and disabled)

Texts

Many texts are used for translation in

filter editors

context menus

ColumnsTextHelper is made for this, set in ListView with

Properties	Usage	Desciption
ClearAllFilterText	Context Menu	for define text in normal context menu for clear all filter (in picture = effacer tous les filtres) [default = »Clear all filter »]
ClearFilterText	Context Menu	for define text in normal context menu for clear current filter (in picture = effacer ce filtre) [default = »Clear filter »]
ClearProfilText	Context Menu	for define text in selected profil context menu (in picure = Clear selected profil) [default = »Clear selected profil »]
ProfilText	Context Menu	for define text before in normal context menu when profil is set (in picure = selected profil) [default = »Profil »]
EnumNoneText	Filter	for define text in filter for All checker (in picture = tous selectionner) [default = »None view »]
EnumAllText	Filter	for define text in filter for None checker (in picture = tous deselectionner) [default = »All view »]

see MainWindowProfil.xaml for sample

Static Acess

For better acces you can use static command for

ClearSortCommand for clear current sorting

Command="{x:Static local:ColumnsManager.ClearSortCommand}"
CommandParameter="{Binding ., ElementName=lv}"

1 2	Command="{x:Static local:ColumnsManager.ClearSortCommand}" CommandParameter="{Binding ., ElementName=lv}"

ClearAllFilterCommand

Command="{x:Static local:FilterManager.ClearAllFilterCommand}"
CommandParameter="{Binding ., ElementName=lv}"

1 2	Command="{x:Static local:FilterManager.ClearAllFilterCommand}" CommandParameter="{Binding ., ElementName=lv}"

see MainWindowProfil.xaml for sample

and you can acess to profils but it’s more complex because you can get the ColumnsManager from ListView

see MainWindowBase.cs for sample (region PROFILS) and see MainWindowProfil.xaml for binding

<ToggleButton Content="Select profil"
                          x:Name="btp"
                          Height="32"
                          Margin="0 4 0 0"
                          Command="{Binding ColumnsManagerCommand}"
                          CommandParameter="{Binding ElementName=lv}"
                          local:ToggleButtonHelper.Popup="{Binding ElementName=popup}" />
            <Popup x:Name="popup"
                   StaysOpen="false"
                   PlacementTarget="{Binding ElementName=btp}"
                   Placement="Bottom"
                   VerticalOffset="4">
                <Border BorderThickness="0"
                        SnapsToDevicePixels="true"
                        Margin="0 0 0 0"
                        Width="100">
                    <ListBox BorderThickness="1"
                             BorderBrush="Black"
                             ItemsSource="{Binding Profils}"
                             SelectedItem="{Binding SelectedProfil}"
                             VerticalContentAlignment="Stretch"
                             HorizontalContentAlignment="Stretch" />
                </Border>
            </Popup>

<ToggleButton Content="Select profil"

x:Name="btp"

Height="32"

Margin="0 4 0 0"

Command="{Binding ColumnsManagerCommand}"

CommandParameter="{Binding ElementName=lv}"

local:ToggleButtonHelper.Popup="{Binding ElementName=popup}" />

<Popup x:Name="popup"

StaysOpen="false"

PlacementTarget="{Binding ElementName=btp}"

Placement="Bottom"

VerticalOffset="4">

<Border BorderThickness="0"

SnapsToDevicePixels="true"

Margin="0 0 0 0"

Width="100">

<ListBox BorderThickness="1"

BorderBrush="Black"

ItemsSource="{Binding Profils}"

SelectedItem="{Binding SelectedProfil}"

VerticalContentAlignment="Stretch"

HorizontalContentAlignment="Stretch" />

</Border>

</Popup>

overall you must have get ColumnsManger from ListView in Constructor after loading

public MainWindowProfil() : base()
        {
            InitializeComponent();
            // update ColumnsManager 
            this.Loaded += delegate { ColumnsManager = ColumnsManager.Get(this.lv); };
        }

public MainWindowProfil() : base()

{

InitializeComponent();

// update ColumnsManager

this.Loaded += delegate { ColumnsManager = ColumnsManager.Get(this.lv); };

}

and after add adapter for Profils and SelectedProfil

 public Profil[] Profils => ColumnsManager?.Profils;

        #region SelectedProfil      
        public Profil SelectedProfil
        {
            get => ColumnsManager?.SelectedProfil;
            set
            {
                if (ColumnsManager != null)
                {
                    ColumnsManager.SelectedProfil = value;
                    OnPropertyChanged("SelectedProfil");
                }
            }
        }
        #endregion

public Profil[] Profils => ColumnsManager?.Profils;

#region SelectedProfil

public Profil SelectedProfil

{

get => ColumnsManager?.SelectedProfil;

set

{

if (ColumnsManager != null)

{

ColumnsManager.SelectedProfil = value;

OnPropertyChanged("SelectedProfil");

}

#endregion

for syncronize profil to reality (raise SelectedProfil for wrapper) use

    #region ColumnsManager
        private ColumnsManager _ColumnsManager = null;
        public ColumnsManager ColumnsManager
        {
            get => _ColumnsManager;
            set
            {
                if (_ColumnsManager == null && value != null)
                {
                    _ColumnsManager = value;
                    PropertyChanged?.Invoke(this, new PropertyChangedEventArgs("Profils"));
                    PropertyChanged?.Invoke(this, new PropertyChangedEventArgs("SelectedProfil"));
                    CommandManager.InvalidateRequerySuggested();
                    _ColumnsManager.PropertyChanged += (ss, ee) =>
                    {
                        if ("SelectedProfil".Equals(ee.PropertyName))
                        {
                            PropertyChanged?.Invoke(this, new PropertyChangedEventArgs("SelectedProfil"));
                        }
                    };
                }
            }
        }
        #endregion

#region ColumnsManager

private ColumnsManager _ColumnsManager = null;

public ColumnsManager ColumnsManager

{

get => _ColumnsManager;

set

{

if (_ColumnsManager == null && value != null)

{

_ColumnsManager = value;

PropertyChanged?.Invoke(this, new PropertyChangedEventArgs("Profils"));

PropertyChanged?.Invoke(this, new PropertyChangedEventArgs("SelectedProfil"));

CommandManager.InvalidateRequerySuggested();

_ColumnsManager.PropertyChanged += (ss, ee) =>

{

if ("SelectedProfil".Equals(ee.PropertyName))

{

PropertyChanged?.Invoke(this, new PropertyChangedEventArgs("SelectedProfil"));

}

};

}

#endregion

if you want to have a ClearProfil command

 #region ClearProfil (COMMAND)
        RelayCommand _ClearProfilCommand;
        public ICommand ClearProfilCommand
        {
            get
            {
                if (_ClearProfilCommand == null)
                {
                    _ClearProfilCommand = new RelayCommand(
                        param => SelectedProfil = null,
                        param => SelectedProfil != null);
                }
                return _ClearProfilCommand;
            }
        }
        #endregion

#region ClearProfil (COMMAND)

RelayCommand _ClearProfilCommand;

public ICommand ClearProfilCommand

{

get

{

if (_ClearProfilCommand == null)

{

_ClearProfilCommand = new RelayCommand(

param => SelectedProfil = null,

param => SelectedProfil != null);

}

return _ClearProfilCommand;

}

#endregion

Saving

The LisView can be save automatically by using local:ColumnsHelper.SaveColumnPositionID= »profil » set in ListView

this mean it save

Columns position
Columns width
if Columns are visible or not (and if you restore visibility you recover previous width)
Selected profil

Filter values and sort column are not saved in version 1

You must set different SaveColumnPositionID for each ListView

Save value are set (by default) in .ini file in %APPDATA%\[compagny]\[product].ini however you can set for saving all ListView information in registry at Computer\HKEY_CURRENT_USER\SOFTWARE\[compagny]\[product]\[Id] by using ColumnsHelper.UseIni = false; at the start of the software (before all InitializeComponent() )

Other

If you want to specify Mininum for all columns you can use local:ColumnsHelper.MinColumnsWidth= »60″ set in ListView rather than define in each columns

see MainWindowProfil.xaml for sample

Also you can see another helper define for solve problems on DateTimePicker, Togglebutton or TextBox

See helpers for each for more informations

Project

You can download project

Version 1

(for window template) ColumSave + GridViewColumn v1

Version 2

this version add : ColumSave + GridViewColumn v2

Properties	Apply to	Desciption
ShowNoSortIndicator	GridViewColumnEx or GridViewColumnHeaderEx	for showing an indicator (in gray) only if CanSort = false [default = false]
CanSelectProfil	ListView	Allow to select profil in select context menu (otherwise show no context) [default = true]
CanShowProfil	ListView	Allow to show profil in view context menu (otherwise show no context) [default = true]
SelectedProfil	ListView	to change current profil with value string see MainWindowProfil.cs for sample

local:ColumnsHelper.CanSelectProfil="{Binding SelectProfil}"
local:ColumnsHelper.CanShowProfil="{Binding ShowProfil}"
local:ColumnsHelper.SelectedProfil="{Binding SelectedProfil}"

local:ColumnsHelper.CanSelectProfil="{Binding SelectProfil}"

local:ColumnsHelper.CanShowProfil="{Binding ShowProfil}"

local:ColumnsHelper.SelectedProfil="{Binding SelectedProfil}"

Categories: Non classé Tags:

Commentaires (0) Trackbacks (0) Commenter Trackback

Pas encore de commentaire

Pas encore de trackbacks

ToggleButton to control Popup AutoGrid compoment for input form

WPF Addict

ListView Columns Arrange, Sort, Filter, Save with no code behind

Warning

Components

properties for both

properties for local:GridViewColumnEx

propertie for local:GridViewColumnHeaderEx

Structure

Editors

Profils

Other

ContextMenus

Texts

Static Acess

Saving

Other

Project

Version 1

Version 2

Articles récents

Commentaires récents

Archives

Catégories

Méta

Categories

Blogroll

Archives

Meta