적응형 카드를 생성, 재사용, 공유하는 데 도움이 되는 새로운 도구의 미리 보기를 공유하게 되어 기쁩니다.
중요
2020년 5월 릴리스 후보의 주요 변경 내용
템플릿 릴리스 후보에는 이전 패키지를 사용하는 경우 알고 있어야 하는 몇 가지 주요 변경 내용이 포함되어 있습니다. 자세한 내용은 다음을 참조하세요.
2020년 5월 현재 주요 변경 내용
바인딩 구문이 {...}에서 ${...}로 변경되었습니다.
예를 들어, "text": "Hello {name}"는 "text": "Hello ${name}"가 됩니다.
JavaScript API는 더 이상 EvaluationContext 개체를 포함하지 않습니다. 데이터를 expand 함수에 전달하기만 하면 됩니다. 자세한 내용은 SDK 페이지를 참조하세요.
.NET API는 JavaScript API와 더 가깝게 일치하도록 다시 디자인되었습니다. 자세한 내용은 SDK 페이지를 참조하세요.
템플릿 활용 방법
템플릿을 사용하면 적응형 카드에서 레이아웃과 데이터를 분리할 수 있습니다.
카드를 한 번 디자인하고 실제 데이터로 채우는 데 유용
현재 적응형 카드 디자이너를 사용하여 카드를 만든 다음, 해당 JSON을 사용하여 동적 콘텐츠로 페이로드를 채울 수는 없습니다. 이 작업을 수행하려면 사용자 지정 코드를 작성하여 JSON 문자열을 빌드하거나 개체 모델 SDK를 사용하여 카드를 나타내는 OM을 빌드하고 JSON으로 직렬화해야 합니다. 어떤 경우든 디자이너는 일회성 단방향 작업이며 나중에 코드로 변환한 후에는 카드 디자인을 쉽게 조정할 수 없습니다.
유선 전송 간소화
템플릿과 데이터를 클라이언트에서 직접 결합할 수 있는 환경을 생각해 보세요. 즉, 동일한 템플릿을 여러 번 사용하거나 새 데이터를 사용하여 업데이트하려는 경우 새 데이터를 디바이스에 전송하기만 하면 동일한 템플릿을 계속 다시 사용할 수 있습니다.
자신이 제공하는 데이터로만 멋진 카드를 만드는 데 유용
적응형 카드도 좋지만 사용자에게 표시하려는 모든 항목에 대한 적응형 카드를 작성할 필요가 없다면 어떨까요? 아래에 설명된 템플릿 서비스를 사용하면 모든 사용자가 모든 유형의 데이터에 대한 템플릿을 기고, 검색 및 공유할 수 있는 환경을 만들 수 있습니다.
자체 프로젝트, 조직 내에서 또는 전체 인터넷과 공유할 수 있습니다.
AI 및 기타 서비스를 통해 사용자 환경 개선 가능
콘텐츠와 데이터를 분리하여 AI 및 기타 서비스가 카드에 표시되는 데이터를 "추론"할 수 있게 해주고, 사용자 생산성을 개선하거나 항목을 검색할 수 있게 해줍니다.
적응형 카드 템플릿이란?
3가지 주요 구성 요소로 이루어져 있습니다.
템플릿 언어 는 템플릿을 작성하는 데 사용되는 구문입니다. 디자이너를 사용하여 디자인 타임에 "샘플 데이터"를 포함하여 템플릿을 미리 볼 수도 있습니다.
템플릿 SDK 는 지원되는 모든 적응형 카드 플랫폼에 존재합니다. 이러한 SDK를 사용하여 백 엔드에서 또는 클라이언트에서 직접 실제 데이터로 템플릿을 채울 수 있습니다.
템플릿 서비스 는 누구나 잘 알려진 템플릿 세트를 찾고, 기고하고, 공유할 수 있게 해주는 개념 증명 서비스입니다.
아래 JavaScript는 템플릿을 데이터로 채우는 데 사용되는 일반적인 패턴을 보여줍니다.
var template = new ACData.Template({
// Card Template JSON
});
var card = template.expand({
$root: {
// Data Fields
}
});
// Now you have an AdaptiveCard ready to render!
C# 예
아래 C#은 템플릿을 데이터로 채우는 데 사용되는 일반적인 패턴을 보여줍니다.
var template = new AdaptiveCards.Templating.AdaptiveCardTemplate(cardJson);
var card = template.Expand(new {Key="Value"});
// Now you have an AdaptiveCard ready to render!
적응형 카드를 사용하여 API 데이터를 시각적으로 렌더링하여 선언적 에이전트의 사용자 환경을 개선하는 방법을 알아봅니다. 적응형 카드 템플릿을 만들고 구성하고, API 플러그 인에 통합하고, Microsoft 365 Copilot 설치 프로그램을 테스트합니다. Visual Studio Code 적응형 카드를 빌드하고 미리 보기 위한 실용적인 단계를 알아봅니다.