locked
Windows store app - Richtextblock and InlineUIContainer RRS feed

  • Question

  • So in my app i add 5 images into  a richtextblock by using an InlineUIContainer
     I want the user to be able to click on a certain image so i can expand it.  But richtextblock doesn't have an items click event. How can i do this?
    Wednesday, August 21, 2013 12:16 AM

Answers

  • Hi,kalel111

    You can set the image to contain in a button control,code in xaml like this:

    <RichTextBlock> <Paragraph> <Italic>This is an inline image.</Italic> <InlineUIContainer> <Button> <Image Source="Assets/SmallLogo.png"/> </Button> </InlineUIContainer> Mauris auctor tincidunt auctor. </Paragraph> </RichTextBlock>

    Best Wishes!


    <THE CONTENT IS PROVIDED "AS IS" WITHOUT WARRANTY OF ANY KIND, WHETHER EXPRESS OR IMPLIED>
    Thanks
    MSDN Community Support

    Please remember to "Mark as Answer" the responses that resolved your issue. It is a common way to recognize those who have helped you, and makes it easier for other visitors to find the resolution later.


    Wednesday, August 21, 2013 9:51 AM
  • There is no need to wrap the Image in a Button unless you specifically need a Click event (Click is a Button event)  All UIElements (including Image) support Tapped, PointerPressed, PointerReleased, etc.

    You can subscribe to events on the Image object before you add it to the RichTextBlock.

    --Rob

    Friday, August 23, 2013 12:31 AM
    Moderator
  • Check the sender the same way you would for any other event handler. Being in a RichTextBlock is irrelevant to this.

    --Rob

    Friday, August 23, 2013 1:31 AM
    Moderator
  • The arguments passed to an event handler are composed of at least two components:  the sender and the EventArgs.  The sender is the actual object which actually raised the event.  In an event handler, it's always brought in as an "object" type because there can be multiple types which raise that event.  When you know the exact types that raised an event, you can cast the object as the type and use it appropriately.  Here's an example:

    <StackPanel>
      <TextBlock HorizontalAlignment="Center">This is Image1:</TextBlock>
      <Image Tapped="Image_Tapped" x:Name="Image1" Source="Assets/Logo.png" Height="100" Width="100"/>
      <Grid Height="150"/>
      <TextBlock HorizontalAlignment="Center">This is Image2:</TextBlock>
      <Image Tapped="Image_Tapped" x:Name="Image2" Source="Assets/Logo.png" Height="100" Width="100"/>
    </StackPanel>
    private async void Image_Tapped(object sender, TappedRoutedEventArgs e)
      {
        Image ThisImage = sender as Image;
        Windows.UI.Popups.MessageDialog MyDialog = new MessageDialog("The sender for this event call was " + ThisImage.Name);
        await MyDialog.ShowAsync();
    }



    Matt Small - Microsoft Escalation Engineer - Forum Moderator
    If my reply answers your question, please mark this post as answered.

    NOTE: If I ask for code, please provide something that I can drop directly into a project and run (including XAML), or an actual application project. I'm trying to help a lot of people, so I don't have time to figure out weird snippets with undefined objects and unknown namespaces.

    Wednesday, August 28, 2013 3:19 PM
    Moderator

All replies

  • Hi,kalel111

    You can set the image to contain in a button control,code in xaml like this:

    <RichTextBlock> <Paragraph> <Italic>This is an inline image.</Italic> <InlineUIContainer> <Button> <Image Source="Assets/SmallLogo.png"/> </Button> </InlineUIContainer> Mauris auctor tincidunt auctor. </Paragraph> </RichTextBlock>

    Best Wishes!


    <THE CONTENT IS PROVIDED "AS IS" WITHOUT WARRANTY OF ANY KIND, WHETHER EXPRESS OR IMPLIED>
    Thanks
    MSDN Community Support

    Please remember to "Mark as Answer" the responses that resolved your issue. It is a common way to recognize those who have helped you, and makes it easier for other visitors to find the resolution later.


    Wednesday, August 21, 2013 9:51 AM
  • Okay , i guess this code works for static controls. But in my project i am adding the image to the richtextblock  using C#. So the amount of image will not be static. What should i do?
    Friday, August 23, 2013 12:11 AM
  • There is no need to wrap the Image in a Button unless you specifically need a Click event (Click is a Button event)  All UIElements (including Image) support Tapped, PointerPressed, PointerReleased, etc.

    You can subscribe to events on the Image object before you add it to the RichTextBlock.

    --Rob

    Friday, August 23, 2013 12:31 AM
    Moderator
  • So how  would i know which image in my richTextblock is clicked? The number of images in it will always be dynamic.
    Friday, August 23, 2013 12:47 AM
  • Check the sender the same way you would for any other event handler. Being in a RichTextBlock is irrelevant to this.

    --Rob

    Friday, August 23, 2013 1:31 AM
    Moderator
  • I've never worked with senders in events before. How would i do that?  Sample codes will help.
    Friday, August 23, 2013 2:01 AM
  • The arguments passed to an event handler are composed of at least two components:  the sender and the EventArgs.  The sender is the actual object which actually raised the event.  In an event handler, it's always brought in as an "object" type because there can be multiple types which raise that event.  When you know the exact types that raised an event, you can cast the object as the type and use it appropriately.  Here's an example:

    <StackPanel>
      <TextBlock HorizontalAlignment="Center">This is Image1:</TextBlock>
      <Image Tapped="Image_Tapped" x:Name="Image1" Source="Assets/Logo.png" Height="100" Width="100"/>
      <Grid Height="150"/>
      <TextBlock HorizontalAlignment="Center">This is Image2:</TextBlock>
      <Image Tapped="Image_Tapped" x:Name="Image2" Source="Assets/Logo.png" Height="100" Width="100"/>
    </StackPanel>
    private async void Image_Tapped(object sender, TappedRoutedEventArgs e)
      {
        Image ThisImage = sender as Image;
        Windows.UI.Popups.MessageDialog MyDialog = new MessageDialog("The sender for this event call was " + ThisImage.Name);
        await MyDialog.ShowAsync();
    }



    Matt Small - Microsoft Escalation Engineer - Forum Moderator
    If my reply answers your question, please mark this post as answered.

    NOTE: If I ask for code, please provide something that I can drop directly into a project and run (including XAML), or an actual application project. I'm trying to help a lot of people, so I don't have time to figure out weird snippets with undefined objects and unknown namespaces.

    Wednesday, August 28, 2013 3:19 PM
    Moderator