完整页面示例
这个下载页面组合本地化、Command、NativeHost、运行时条件和 VirtualList。
DownloadPage.pxml
xml
<?pxml version="1.0" strict="true"?>
<Page
xmlns="pcl://ui"
xmlns:x="urn:pcl:pxml:x"
xmlns:local="urn:sample"
x:Name="DownloadPage">
<Column
Padding="{theme Spacing.Large}"
Gap="{theme Spacing.Medium}">
<Row Gap="12" Align="Center">
<Text Class="PageTitle" Text="{loc Download.Title}" />
<Spacer />
<Button
Text="{loc Common.Refresh}"
Command="{cmd Versions.Refresh}"
AccessibleName="{loc Common.Refresh}" />
</Row>
<NativeHost
Kind="TextBox"
Value="{bind Download.SearchText}"
Placeholder="{loc Download.SearchPlaceholder}"
AccessibleName="{loc Download.SearchLabel}" />
<x:If Condition="{bind Download.IsLoading}">
<Text Text="{loc Common.Loading}" />
<x:Else>
<VirtualList
Items="{bind Download.VisibleVersions}"
Key="{item.Id}"
EstimatedItemHeight="56"
OverscanBefore="2"
OverscanAfter="3">
<Template As="item">
<local:VersionCard
Version="{item}"
Command="{cmd Download.Install}"
CommandParameter="{item.Id}" />
</Template>
</VirtualList>
</x:Else>
</x:If>
</Column>
</Page>VersionCard.pxml
xml
<?pxml version="1.0"?>
<x:Component xmlns:x="urn:pcl:pxml:x" x:Name="VersionCard">
<x:Property Name="Version" Type="VersionModel" Required="true" />
<x:Property Name="Command" Type="command" Required="true" />
<x:Property Name="CommandParameter" Type="string" Required="true" />
<Row Class="version-card" Padding="12" Gap="8" Align="Center">
<Column Gap="4">
<Text Text="{component.Version.Name}" />
<Text Text="{component.Version.ReleaseDate}" />
</Column>
<Spacer />
<Button
Text="{loc Common.Install}"
Command="{component.Command}"
CommandParameter="{component.CommandParameter}"
AccessibleName="{loc Common.Install}" />
</Row>
</x:Component>构建
bash
pxmlc --full DownloadPage.pxml -o DownloadPage.pxb \
--component VersionCard.pxml \
-D RELEASE --release --strict --warn-as-error
pxmlc inspect DownloadPage.pxb
pxmlc dump DownloadPage.pxbHost 还需要注册强类型 Download state schema、Command ID、本地化表、Theme Token、VersionCard 的组件 schema,以及 VirtualList 的 IUiVirtualItemSource adapter。它们是构建/Runtime integration contract,不应通过反射从页面对象临时发现。
至此,你已经走完从 source authoring、复用组件、响应式状态、虚拟化到 Release PXB 的完整路径。继续查阅 编译器 CLI 和 编译阶段与 PXB。
