microsoft / microsoft/AdaptiveCards

WidgetProvider's Media (video player) component shows the play button cut in half.

Open
#9,348 2 comments 0 reactions 0 assignees View on GitHub

Nobody has claimed this yet.

Dominant language
C#
Stars
2k
Forks
595
Avg merge
1d 19h
Merged PRs (30d)
1

Description

Describe the bug

I want to create a widget with a Media component that let users play a video, but the Play button appears cut in half when I deploy the project. Please see the Image1 attached.

If I use the https://adaptivecards.io/designer/, it appears not cut in half. Please see Image2

Here I attached a template.json with that shows that issue. Remember to replace the <VIDEO_URL-MP4> with a valid video url :

{
  "type": "AdaptiveCard",
  "$schema": "http://adaptivecards.io/schemas/adaptive-card.json",
  "version": "1.6",
  "body": [

    {
      "type": "TextBlock",
      "text": "Video Title",
      "wrap": true,
      "style": "heading"
    },
    {
      "type": "Media",
      "sources": [
        {
          "mimeType": "video/mp4",
          "url": "<VIDEO_URL-MP4>"
        }
      ]
    }
  ]
}

 

Steps to reproduce the bug
  1. Go to https://learn.microsoft.com/en-us/samples/microsoft/windowsappsdk-samples/widgets/
  2. Download the Widgets.zip file clicking the "Download ZIP" button.
  3. Open the .sln file with VS 2022 in cs-console-packaged\CsConsoleWidgetProvider folder
  4. Replace the CountingWidgetTemplate.json content with the code shared in the Bug Description.
  5. Play "Provider on launch"
  6. Find the widget provider associated in the Widget Dashboard and add the CountingWidget to see the issue.
Expected behavior

I want to see a common Play button.

Screenshots

Image1
image

Image2
image

NuGet package version

None

Packaging type

No response

Windows version

No response

IDE

Visual Studio 2022

Additional context

Windows version: 23H2

Contributor guide

Open the contributing guide

First steps

  1. Read the whole issue, then the project's contributing guide.
  2. Comment on the issue to say you are picking it up — it saves two people doing the same work.
  3. Fork the repository and make your change on a branch.
  4. Open a pull request that references the issue number.

Research direction

Start in the cs-console-packaged\CsConsoleWidgetProvider sample opened from the downloaded Widgets.zip, and inspect CountingWidgetTemplate.json after replacing it with the issue's Media example. Run the provider on launch in Visual Studio 2022, add the widget from the Widget Dashboard, and compare the deployed play button with the Adaptive Cards Designer result; done means the button is displayed normally.

Written by the indexing model from the issue text.

Assessment

Tech stack
csharp
Domain
desktop
Issue type
Bug
Difficulty
4/5
Estimated time
3-5 days
Activity status
Stale
Clarity
Mostly clear
Newbie friendliness
38/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.