【炫丽】从0开始做一个WPF+Blazor对话小程序( 九 )


5.3 示例及代码说明先看本示例效果,再给出相关代码说明:

【炫丽】从0开始做一个WPF+Blazor对话小程序

文章插图
图中有三个操作:
  1. 点击主窗体A的【+】按钮,发送了OpenSecondViewMessage消息,打开子窗体B;
  2. 打开子窗体B后,再点击主窗体A的【桃心】按钮,发送了SendRandomDataMessage消息,子窗体B的第二个TabItem Header显示了消息传来的数字;
  3. 点击子窗体B的【安卓】图标按钮,给主窗体A响应了消息ReceivedResponseMessage,主窗体收到后弹出一个对话框 。
三个消息类定义如下:
public class OpenSecondViewMessage : Message{public OpenSecondViewMessage(object sender) : base(sender){}}public class SendRandomDataMessage : Message{public SendRandomDataMessage(object sender, int number) : base(sender){Number = number;}public int Number { get; set; }}public class ReceivedResponseMessage : Message{public ReceivedResponseMessage(object sender) : base(sender){}}除了SendRandomDataMessage传递了一个业务Number属性,另两个消息只是起到通知作用(所以没有额外属性定义),实际开发时可能需要传递业务数据 。
5.3.1 打开多窗体即上面的第一个操作:点击主窗体A的【+】按钮 , 发送了OpenSecondViewMessage消息,打开子窗体B 。
RazorViews\MainView.razor中执行按钮点击,发送打开子窗体消息:
...<MCol><MButton class="mx-2" Fab Dark Color="indigo" OnClick="OpenNewSecondView"><MIcon>mdi-plus</MIcon></MButton></MCol>...@code{...void OpenNewSecondView(){ Messenger.Default.Publish(this, new OpenSecondViewMessage(this));}...}App.xaml.cs里订阅打开子窗体消息:
public partial class App : Application{public App(){// 订阅打开子窗口消息 , 在主窗口点击【+】按钮Messenger.Default.Subscribe<OpenSecondViewMessage>(this, msg =>{var chatWin = new SecondWindowView();chatWin.Show();}, ThreadOption.UiThread);}}实际开发可能情况更复杂,发送的消息OpenSecondViewMessage里带WPF窗体路由(定义的一套路径规则寻找窗体或ViewModel),订阅的地方也可能不在主程序,在子模块的Module类里 。
5.3.2 发送业务数据即第二个操作:打开子窗体B后,再点击主窗体A的【桃心】按钮,发送了SendRandomDataMessage消息,子窗体B的第二个TabItem Header显示了消息传来的数字 。
  1. RazorViews\MainView.razor中执行按钮点击,发送业务消息(就当前时间的Millisecond):
...<MCol><MButton class="mx-2" Fab Small Dark Color="pink" OnClick="SendNumber"><MIcon>mdi-heart</MIcon></MButton></MCol>...@code{...void SendNumber(){ Messenger.Default.Publish(this, new SendRandomDataMessage(this, DateTime.Now.Millisecond));}...}
  1. RazorViews\SecondView.razorOnInitialized()方法里订阅业务消息通知:
@using WPFBlazorChat.Messages<MApp><MToolbar><MTabs BackgroundColor="primary" Grow Dark><MTab><MBadge Color="pink" Dot>Item One</MBadge></MTab><MTab><MBadge Color="green" Content="tagCount">Item Two</MBadge></MTab><MTab><MBadge Color="deep-purple accent-4" Icon="mi-masa">Item Three</MBadge></MTab></MTabs></MToolbar><MRow><MButton class="mx-2" Fab Dark Large Color="purple" OnClick="ReponseMessage"><MIcon>mdi-android</MIcon></MButton></MRow></MApp>@code{private int tagCount = 6;protected override void OnInitialized(){// 订阅业务消息,在主窗口点击桃心按钮时触发Messenger.Default.Subscribe<SendRandomDataMessage>(this, msg =>{this.InvokeAsync(() => { this.tagCount = msg.Number; });this.StateHasChanged();}, ThreadOption.UiThread);}void ReponseMessage(){// 通知主窗体,我已经收到消息 , 请不要再发Messenger.Default.Publish(this, new ReceivedResponseMessage(this));}}注意看,上面收到消息时有两个方法要简单说一下,看OnInitialized()里的代码: