Posts

Showing posts with the label WPF

Donate

How To Apply Checkbox Check All To WPF DataGrid Using MVVM Pattern

Image
Good day Gents! In this post, I will demonstrate on how to create a WPF DataGrid application that has a check all checkbox behavior for selecting all rows using the MVVM Pattern. First is we need to create a .NET Core WPF project that targets the .NET 7 framework with a project structure similar to the screenshot below. App.config Update your App.config's connection string with your local database connection. <configuration> <connectionStrings> <add name= "products" connectionString= "data source=.;Initial Catalog=TestDatabase;Integrated Security=true;" providerName= "System.Data.SqlClient" /> </connectionStrings> </configuration> DBUtil.cs The DBUtil class will retrieve records from the database and update the discontinued field of a particular product. public static class DBUtil { public static DataTable GetProduct() { DataSet ds = new DataSet(); string q...

How To Set Overlay On Top Of A WPF WebBrowser Or WebView2 Control

Image
Good day! A common scenario to our projects is to use the Overlay concept that is, show a nearly transparent modal on top of our form. I have been using the code below to create an Overlay using just a Border and a TextBlock but to no avail, it just won't sit right on top of the WebBrowser control. In the picture right next to the Border control snippet, only the input controls are covered by the overlay and ignoring the WebBrowser control. <Border BorderBrush= "Black" BorderThickness= "1" Background= "#80000000" Visibility= "{Binding Path=IsBusy, Converter={StaticResource BoolToVisibilityConverter}}" Grid.RowSpan= "4" Grid.ColumnSpan= "3" > <Grid> <TextBlock TextAlignment= "Center" Margin= "0" TextWrapping= "Wrap" Width= "500" Text= "{Binding Path=OverlayMessage}" HorizontalAlignment= "Center" VerticalAlignment= "...

WPF WebBrowser Control Not Rendering External HTML Content Properly

Image
Good day Team, I'm currently working on a project to show some information about settings to a WPF WebBrowser control. The project also has the ability to produce a report in an .html file that can be viewed through the browser by the clients. Upon comparing the results from both the .html file and the file rendered to the webbrowser, I noticed that the html file is broke when rendered. Some of the borders are missing and some of the colors are not reflecting. Upon doing some research, I found a solution that is to change the meta tag to use the MS edge engine. When I verified my code to dynamically generate the html file, I noticed that the code to set the meta tag uses plain text/html content such as the code below. private void WriteOpenMainTags( string prevFile, string currFile, ref StringBuilder openMaintags) { openMaintags.AppendLine( "<!DOCTYPE HTML>" ); openMaintags.AppendLine( "<html>" ); openMaintags.AppendLine( "...

Using MahApps.Metro.IconPacks In WPF Application

Image
Good day! Ever wonder how to style your WPF application controls or window with icons where you can choose from several hundreds of icons in a package? Well, nothing to worry about since there's an awesome Nuget Package that provides icons to suit your needs. It's called MahApps.Metro.IconPacks . The cool thing is, it's even grouped into several categories and that each category containes hundreds of icons. To use this awesome library of icons in your WPF project, install the Nuget Package specifically MahApps.Metro.IconPacks. In your XAML view, reference the MahApps.Metro.IconPacks namespace first. xmlns:iconPacks="http://metro.mahapps.com/winfx/xaml/iconpacks" To use them like applying icons to your menu items, call the iconsPacks namespace and select PackIconMaterial. Then set the Kind property with the icon of your liking. <iconPacks:PackIconMaterial VerticalAlignment= "Center" HorizontalAlignment= "Center" ...

How To Close A Window Via Click Command Using MVVM In WPF

Image
Good day! Here's a simple WPF tutorial on how to close a window in WPF thru button click which applies the MVVM pattern. For simplicity sake, I'll demonstrate by using Menu item with a command to close the window. Start by creating a WPF project that target's the latest framework and add classes for DelegateCommand, MainViewModel and ViewModelBase inside a ViewModels folder. See below project setup. Add the code for ViewModelBase class that implements the INotifyPropertyChanged interface. public class clsViewModelBase : INotifyPropertyChanged { public event PropertyChangedEventHandler PropertyChanged; protected void OnPropertyChanged( string propertyName) { if (PropertyChanged != null ) PropertyChanged( this , new PropertyChangedEventArgs(propertyName)); } } Next is to add the functionality of the DelegateCommand class that implements the ICommand interface. This class handles the Commands bound to the WPF controls pu...

WPF Menu Item Drop Alignment Appears To The Left Instead Of Right In Windows 10

Image
Hello, I was assigned a new laptop and when I ran several of my WPF applications into this machine, I suddenly noticed that the menu items drop alignment appears to the left instead of right. Since this is a OS setting, we need to change some values in the registry. Open registry editor and navigate to this registry path -> Computer\HKEY_CURRENT_USER\SOFTWARE\Microsoft\Windows NT\CurrentVersion\Windows . Change the MenuDropAlignment value from 1 to 0 similar to the picture below. Once done changing the value, make sure to reboot your machine for this changes to take effect. After that, your menu item drop alignment changes from left to right. Output Cheers!

Using OpenFileDialog Or MessageBox In .NET Core Class Library Project With WPF Application

Image
Good day Team! Given that you need to access the OpenFileDialog or MessageBox Dialog In Your .NET Core Class Library that is part of a solution that contains a WPF project, there's an easy hack provided by our Solutions Architect that is to hand hack the .csproj settings. First is to open the .csproj file using an editor. Inside Property Group node, add enable WPF by adding a UseWPF element with the value of true such as below. <Project Sdk= "Microsoft.NET.Sdk" > <PropertyGroup> <TargetFramework>net7.0-windows10.0.17763.0</TargetFramework> <ImplicitUsings>enable</ImplicitUsings> <Nullable>enable</Nullable> <UseWPF>true</UseWPF> </PropertyGroup> <ItemGroup> <PackageReference Include= "Company.Utilities.CompanyLibNET7" Version= "1.0.0.3" /> <PackageReference Include= "Microsoft.Extensions.DependencyInjection" Version= "7....

Process.Start() Error - An error occurred trying to start process. The specified executable is not a valid application for this OS platform.

Image
Good evening! I had an issue when opening PDF files using Process.Start() which is called in a ShowFile() method of the project. The code which isn't working is shown below. System.Diagnostics.Process.Start(Path.Combine(myDocumentsPath, fileName)); The solution for that is to pass a ProcessStartInfo() object in the Start() parameter. And then set UseShellExecute property of the ProcessStartInfo object to true. The modified code that is working is shown below. System.Diagnostics.Process.Start( new ProcessStartInfo(Path.Combine(myDocumentsPath, fileName)) { UseShellExecute = true }); Output

WPF MVVM - How To Pass ViewModel Or Element As ConverterParameter Value In XAML Code

Image
Good evening! In this post, I will demonstrate on how to pass a view model or an element as ConverterParameter value in XAML. This methodology is widely used by developers if you need to retrieve certain values or properties from a view model object or element. To send the view model data context as ConverterParameter value, reference the view model class in the data context node of your form or user control. <UserControl d:DesignHeight= "450" d:DesignWidth= "800" > <UserControl.DataContext> <localmain:ConfigurationResourceManagerViewModel x:Name= "vmResourceManager" /> </UserControl.DataContext> </UserControl> In your element as to where the ConverterParameter is, set it's value with the view model name. In the example snippet below, the ConverterParameter is used in the ComboBox SelectedItem property with a reference to the view model object. <DataGridTemplateColumn Header= "Resource ...

WPF Custom DataGrid Vertical Scrolling Slow With Thousands Of Records

Image
Hello And Good Evening! I was tasked by our software architect to investigate an existing project of our company as to why a custom WPF DataGrid's vertical scrolling is slow, lagging or sluggish. This project will collect and show thousands of records that composed mostly hardware and software assets and it's related attributes. The DataGrid control used in the project is a custom class that inherits the DataGrid class with user-defined functions that performs specific tasks. public class clsCustomDataGrid : DataGrid { public clsCustomDataGrid() { //More codes here... } //More codes here... } We tried setting the virtualizations through the XAML but no luck. The scrolling is still lagging both using the mouse wheel and vertical scroll bar. After several attempts of researching through the forums and trying out the recommended answer, the solution that fixed the vertical scrolling issue is to set the virtualizations of the column, row, VirtualizingPanel a...

WPF CRUD Application Using DataGrid, MVVM Pattern, Entity Framework, And VB.NET

Image
Good day guys! Here's the VB.NET version of this article WPF CRUD Application Using DataGrid, MVVM Pattern, Entity Framework, And C#.NET which is a CRUD (Create,Update and Delete) application using the DataGrid control, ADO.NET Entity Framework 6.x and Model–View–Viewmodel(MVVM) architectural pattern. The project structure and the logic were derived from that article except that this application incorporates Visual Basic.NET/VB.NET as the programming language. I. Project Setup 1. Create a table in your database called Students using the script from this post WPF CRUD With DataGrid, Entity Framework And C#.NET . 2. Create a WPF Project and add four folders called DataAccess, Model, View and ViewModel. The project structure may resemble with the screenshot provided below. II. Coding The Model and Repository Class 1. Inside the Model folder, add an ADO.NET Entity Data Model object that connects to the Students table in your database. On my part, I named it StudentModel . 2. Fo...

Donate