wpf小说阅读器 ----wpf练习demo

发布时间 2023-07-05 15:12:18作者: 赵三毛

1.登录窗口布局

  <Grid>
        <Grid.ColumnDefinitions>
            <ColumnDefinition/>
            <ColumnDefinition Width="2*"/>
        </Grid.ColumnDefinitions>
        <Border >
            <Border.Background>
                <ImageBrush ImageSource="/Wemail.Resource;component/imgs/1.png"/>

            </Border.Background>
            <Grid >

                <Grid.RowDefinitions>
                    <RowDefinition Height="120"/>
                    <RowDefinition Height="80"/>
                    <RowDefinition  Height="50"/>
                    <RowDefinition  Height="80"/>
                    <RowDefinition/>
                </Grid.RowDefinitions>
                <TextBlock Grid.Row="1" Text="注册" FontSize="30" Foreground="White" HorizontalAlignment="Center" VerticalAlignment="Center"/>
                <TextBlock Grid.Row="2" Text="注册一个新账号" FontSize="18" Foreground="White" HorizontalAlignment="Center" VerticalAlignment="Center"/>
                <Grid Grid.Row="3" Width="140" Height="60">
                    <Button  materialDesign:ButtonAssist.CornerRadius="25"
                
                   Style="{StaticResource MaterialDesignRaisedButton}"
                   ToolTip="点击注册">
                        <TextBlock Text="注册" />
                    </Button>
                </Grid>

            </Grid>
        </Border>

        <Grid Grid.Column="1" >
            <Grid.ColumnDefinitions>
                <ColumnDefinition Width="211*"/>
                <ColumnDefinition Width="56*"/>
            </Grid.ColumnDefinitions>
            <Grid.RowDefinitions>
                <RowDefinition Height="160"/>
                <RowDefinition Height="10"/>
                <RowDefinition Height=" 50"/>
                <RowDefinition Height="50"/>
                <RowDefinition/>
                <RowDefinition/>
            </Grid.RowDefinitions>
            <TextBlock Text="用户登录"  FontSize="50" Foreground="BurlyWood" HorizontalAlignment="Left" VerticalAlignment="Center" Margin="167,0,0,0"/>
            <Border BorderBrush="Gray" BorderThickness="1" Grid.Row="2" Margin="150,0,39,0">
                <Grid Width="210" Height="30" >
                    <materialDesign:PackIcon Kind="EmailCheckOutline" Foreground="Gray" Height="30" Width="30" Margin="0 5 0 0"/>
                    <TextBox  x:Name="txtEmail"   Width="170" Height="35" HorizontalAlignment="Right" materialDesign:HintAssist.Hint="请输入邮箱号" 
                              VerticalContentAlignment="Bottom" FontSize="15" Text="{Binding  Username, UpdateSourceTrigger=PropertyChanged}"  ></TextBox>
                </Grid>

            </Border>
            <Border BorderBrush="Gray" BorderThickness="1" Grid.Row="3" Margin="150,0,39,0">
                <Grid Width="210" Height="35" >
                    <materialDesign:PackIcon Kind="LockOutline" Foreground="Gray" Height="30" Width="30" Margin="0 5 0 0"/>
                    <PasswordBox  x:Name="txtPassword"  Width="170" Height="35" HorizontalAlignment="Right" materialDesign:HintAssist.Hint="请输入密码" 
                                  VerticalContentAlignment="Bottom" FontSize="15" Cursor="IBeam" 
                                  base:PasswordBoxHelper.Password="{Binding Password, Mode=TwoWay, UpdateSourceTrigger=PropertyChanged}"
                                  base:PasswordBoxHelper.Attach="true"></PasswordBox>
                </Grid>

            </Border>
            <Grid Grid.Row="4" Margin="197,0,85,0">
                <Button  BorderThickness="0" x:Name="LoginBtn" Background="#39aaa8" Style="{StaticResource MaterialDesignRaisedDarkButton}" Height="40" 
                         materialDesign:ButtonAssist.CornerRadius="20" Command="{Binding LoginCommand }"
                         CommandParameter="{Binding .,RelativeSource={RelativeSource AncestorType=Window}}">
                    <TextBlock Foreground="LightGray" Text="登  录" />
                </Button>
            </Grid>
            <Grid Grid.Row="5" Margin="197,0,85,0">
                <Button  BorderThickness="0"  Background="#39aaa8" Style="{StaticResource MaterialDesignRaisedDarkButton}" Height="40"  x:Name="click" Click="LoginBtn_Click"
                         materialDesign:ButtonAssist.CornerRadius="20" 
                       >
                    <TextBlock Foreground="LightGray" Text="游客登录" />
                </Button>
            </Grid>
        </Grid>

    </Grid>

2.Mainwindow 布局

 <Grid>
        <Grid.RowDefinitions>
            <RowDefinition Height="80"></RowDefinition>
            <RowDefinition ></RowDefinition>
        </Grid.RowDefinitions>
        <Grid Grid.Row="1">
            <Grid.ColumnDefinitions>
                <ColumnDefinition Width="270"/>
                <ColumnDefinition Width="1"/>
                <ColumnDefinition Width="320"/>
                <ColumnDefinition Width="1"/>
                <ColumnDefinition Width="8*"/>
            </Grid.ColumnDefinitions>
            <ListView ItemsSource="{Binding DataCollection}" x:Name="listView" Style="{StaticResource NoScrollBarListViewStyle}">
                <ListView.ItemTemplate>
                    <DataTemplate>
                        <materialDesign:Card Width="250" >
                            <Grid >
                                <Grid.RowDefinitions>
                                    <RowDefinition Height="140" />
                                    <RowDefinition  Height="*" />
                                    <RowDefinition  Height="Auto" />
                                </Grid.RowDefinitions>
                                <Image  Height="140"  Source="{Binding cover }"  />
                                <StackPanel Orientation="Horizontal" Grid.Row="1" >
                                    <TextBlock Text="{Binding title}" FontSize="15"/>
                                    <TextBlock Text="  " FontSize="15"/>
                                    <TextBlock Text="作者:" FontSize="15"/>
                                    <TextBlock Text="{Binding author}" FontSize="15"/>
                                </StackPanel>
                                <StackPanel Grid.Row="1" Margin="8,24,8,0">
                                    <TextBlock   VerticalAlignment="Center" Text="{Binding descs}"
                                       TextWrapping="Wrap" />
                                    <Button  materialDesign:ButtonProgressAssist.IsIndeterminate="True"
                                        materialDesign:ButtonProgressAssist.IsIndicatorVisible="True"
                                        materialDesign:ButtonProgressAssist.Value="-1" Content="开始阅读" 
                                        Command="{Binding  command}" CommandParameter="{Binding fictionId}"
                                        Style="{StaticResource MaterialDesignRaisedButton}" />
                                </StackPanel>
                            </Grid>
                        </materialDesign:Card>
                    </DataTemplate>
                    
                </ListView.ItemTemplate>
            </ListView>
            <Rectangle Grid.Column="1" Width="1" Fill="Black"></Rectangle>
            <Rectangle Grid.Column="3" Width="1" Fill="Black"></Rectangle>
            <ListView ItemsSource="{Binding ChapterList}"   Grid.Column="2" >
                <ListView.ItemTemplate>
                    <DataTemplate>
                        <StackPanel Orientation="Horizontal">
                            <TextBlock Text="{Binding title}" FontSize="15"/>
                            <Button Margin="2,0" materialDesign:ButtonProgressAssist.IsIndeterminate="True"
                                        materialDesign:ButtonProgressAssist.IsIndicatorVisible="True"
                                        materialDesign:ButtonProgressAssist.Value="-1" Content="开始阅读" 
                                        Height="25"          Command="{Binding cmd}" CommandParameter="{Binding chapterId}" 
                                        Style="{StaticResource MaterialDesignRaisedButton}" />
                        </StackPanel>
                            
                            
                        
                      
                    </DataTemplate>

                </ListView.ItemTemplate>
            </ListView>
            <Grid Grid.Column="4" >

                <TextBox Text="{Binding Content}" AcceptsReturn="True" TextWrapping="Wrap" Margin="20,20,20,0" FontSize="20"/>
            </Grid>
        </Grid>
        <materialDesign:ColorZone Padding="16" Mode="PrimaryMid">
            <DockPanel>
                <StackPanel  materialDesign:RippleAssist.IsCentered="True"  Orientation="Horizontal">
                    <materialDesign:ColorZone Margin="16,0,0,0"  Padding="8,4,8,4"  Panel.ZIndex="1"   materialDesign:ElevationAssist.Elevation="Dp2"
                     CornerRadius="2"  Mode="Standard">
                        <Grid>
                            <Grid.ColumnDefinitions>
                                <ColumnDefinition   Width="Auto" />
                                <ColumnDefinition  Width="*" />
                                <ColumnDefinition     Width="Auto" />
                            </Grid.ColumnDefinitions>
                            <Button Style="{StaticResource MaterialDesignToolButton}" Command="{Binding SearchCommand}">
                                <materialDesign:PackIcon   Kind="Search" Opacity=".56" />
                            </Button>
                  
                            <TextBox     Grid.Column="1"   MinWidth="200"  Margin="8,0,0,0" VerticalAlignment="Center"
            materialDesign:HintAssist.Hint="Build a search bar"
            materialDesign:TextFieldAssist.DecorationVisibility="Hidden" Text="{Binding SearchText,Mode=TwoWay,UpdateSourceTrigger=PropertyChanged}"
            BorderThickness="0" />
                        </Grid>
                    </materialDesign:ColorZone>

                </StackPanel>
            </DockPanel>
        </materialDesign:ColorZone>

    </Grid>

3.数据库配置

<?xml version="1.0" encoding="utf-8" ?>
<configuration>
    <connectionStrings>
        <add name="demoDB" connectionString="Data Source=localhost;Database=wemail;User ID=sa;Password=123456;TrustServerCertificate=true"/>
    </connectionStrings>
</configuration>

4.登录逻辑

using Microsoft.Data.SqlClient;
using System;
using System.Collections.Generic;
using System.Configuration;
using System.Linq;
using System.Text;
using System.Threading.Tasks;

namespace Wemail.DAL
{
    public class SqlServerAccess

    {    
      //读取app.config中数据库连接字符串
        string connectionString = ConfigurationManager.ConnectionStrings["demoDB"].ConnectionString;
        public bool IsValid(string username, string password)
        {   //读取app.config中数据库连接字符串
           
            using (SqlConnection connection = new SqlConnection(connectionString))
            {
                connection.Open();
                // 查询数据库获取对应用户记录
                string query = "SELECT COUNT(*) FROM [user] WHERE username = @username AND password = @password";
                using (SqlCommand command = new SqlCommand(query, connection))
                {
                    command.Parameters.AddWithValue("@username", username);
                    command.Parameters.AddWithValue("@password", password);

                    int count = (int)command.ExecuteScalar();

                    if (count > 0)
                    {
                        return true;  // 用户名和密码有效
                    }
                    else
                    {
                        return false;  // 用户名和密码无效
                    }
                }
            }
        }
    }
}

5.在LoginwindowViewModel里面完成登录逻辑调用

using Microsoft.Data.SqlClient;
using Microsoft.IdentityModel.Tokens;
using Prism.Commands;
using Prism.Mvvm;
using Prism.Services.Dialogs;
using System;
using System.Collections.Generic;
using System.Configuration;
using System.Linq;
using System.Text;
using System.Threading.Channels;
using System.Threading.Tasks;
using System.Windows;
using System.Windows.Input;
using System.Windows.Navigation;
using Wemail.DAL;
using Wemail.Views;

namespace Wemail.ViewModels
{
    public class LoginWindowViewModel : BindableBase
    {
        private string _username="admin";
        private string _password="123456";
        public string Username { get { return _username; } set { SetProperty(ref _username, value); } }
        public string Password { get { return _password;}set { SetProperty(ref _password, value);} }
        public ICommand LoginCommand { get => new DelegateCommand<object>(Login);  }

        SqlServerAccess sqlServerAccess = new SqlServerAccess();
        LoginWindow loginWindow = new LoginWindow();
        public LoginWindowViewModel()
        {

        }
        private void Login(object obj)
        {     
            //进行登录校验
            if (sqlServerAccess.IsValid(Username, Password))
            {
               (obj as Window).DialogResult=true;
            }
            else MessageBox.Show("账号或密码错误!");
        }

    }
}

 

 

完整代码   https://gitee.com/zhaosanmao/wpf-exercise-demo

运行截图: