UWP Invoce ContentDialog as Service using Dependency Injection

Question

I'm trying to adapt the example from the post UWP ContentDialog Invocation. I use the same code, but when I press the button only an empty box appears:

In addition my MainPage.xaml.cs:

public sealed partial class MainPage : Page
{
    public MainPage()
    {
        this.InitializeComponent();
        SpeechDialogService dialog = new SpeechDialogService();
        AbcViewModel = new AbcViewModel(dialog);
    }
    public AbcViewModel AbcViewModel { get; set; }
}

And a snipped from the MainPage.xaml.cs:

<Page
...
    <Grid>
        <Button Content="Translate" Click="{x:Bind AbcViewModel.Dictate}" />
    </Grid>
</Page>

What am I doing wrong? I'm grateful for any help.

EDIT:

I'm using this Service and it it looks good in the designer:

Speech.xaml

<ContentDialog
x:Class="DI_sample.Views.Speech"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:local="using:DI_sample.Views"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
mc:Ignorable="d"
Title="Dictate"
PrimaryButtonText="Accept"
SecondaryButtonText="Cancel"
>
<Grid>
    <Grid.RowDefinitions>
        <RowDefinition Height="auto"/>
        <RowDefinition Height="auto"/>
        <RowDefinition Height="auto"/>
        <RowDefinition Height="auto"/>
    </Grid.RowDefinitions>
    <Grid.ColumnDefinitions>
        <ColumnDefinition Width="150" />
        <ColumnDefinition Width="150" />
    </Grid.ColumnDefinitions>
        <Button Margin="15" Content="Dictate" Grid.Row="0" Grid.Column="0" HorizontalAlignment="Stretch"/>
    <Button  Margin="15" Content="Clear Text" Grid.Row="0" Grid.Column="1" HorizontalAlignment="Stretch"/>
    <TextBlock Grid.Row="1" Grid.ColumnSpan="2" Text="Tap 'Dictate', and speak" FontSize="12" />
        <TextBlock Margin="0 10 0 0" Grid.Row="2" Grid.ColumnSpan="2" Text="Message Dication" HorizontalAlignment="Center" FontSize="24"  />
    <ScrollViewer Grid.Row="3" Grid.ColumnSpan="2" Height="300">
        <TextBox Margin="5 5 5 10"  AcceptsReturn="True"  />
    </ScrollViewer>
</Grid>

Also I use the code from this answer to the question I've linked above:

public interface ISpeechDialogService
{
    Task ShowAsync();
}

public class SpeechDialogService : ISpeechDialogService
{   
    public async Task ShowAsync()
    {
        var contentDialog = new Speech();
        await contentDialog.ShowAsync();
    }
}


public class AbcViewModel
{
    readonly ISpeechDialogService _dialog;

    public AbcViewModel(ISpeechDialogService dialog)
    {
        _dialog = dialog;
    }

    public async void Dictate(object obj)
    {
        await _dialog.ShowAsync();
    }
}

Where's your separate ContentDialog XAML file? Please post the xaml code here. I would help you check it. — Xie Steven, Aug 24 '18 at 03:04
@XavierXie-MSFT Thank you for the reply, I've added the code. — C-Jay, Aug 24 '18 at 06:37

score 2 · Answer 1 · answered Aug 24 '18 at 07:24

Actually, I got an error when building your code sample on my side.

XamlCompiler error WMC1121: Invalid binding assignment : Invalid signature for event 'Click'. Events can only be bound to methods that match the event signature or are parameterless

But, I believe this issue is not related to your 'empty ContentDialog' issue. I just changed the Dictate method like the following:

public async void Dictate(object sender, RoutedEventArgs e)
{
    await _dialog.ShowAsync();
}

Then, everything is OK. You could see the screenshot:

Your issue should be in other places, but I'm not sure. Please tell me your project's target version and min version, OS build version. Please also provide a simple reproducible code sample. You could upload it and post link here. I would try to help you diagnose this issue.

I screwed up my project. So I created a new with same settings and same code (without "object sender, RoutedEventArgs e" ) and it now works. Thank you for your help. — C-Jay, Aug 24 '18 at 18:35

score 0 · Accepted Answer · answered Aug 24 '18 at 21:24

I only created a simple XAML View (Speech.xaml). However, the code-behind is required and therefore a ContentPage / ContentView (+Speech.xaml.cs) is required. So the XAML view must be replaced by a ContentView to fix the problem.

added Speech.xaml.cs:

    public sealed partial class Speech : ContentDialog
{
    public Speech()
    {
        this.InitializeComponent();
    }
}

UWP Invoce ContentDialog as Service using Dependency Injection

2 Answers2