Factory Content 资源

Factory Content 资产包包含现成的组件和材料,您可以使用它们更快地创建原型项目。

在这里您可以找到所有的 Factory Content 资产:

  • 2D 交互控制组件,您可以使用这些组件使您的应用程序具有交互性。请参阅 交互性控件组件。

  • 进度组件可用于指示任务正在进行中。请参阅 进度组件。

  • 列出可用于呈现排列在可滚动列表中的项目集合的组件。请参阅 列出组件。

  • 完整的用户界面组件,您可以使用它们为您的应用程序添加功能。请参阅 完整的用户界面组件。

  • 可以应用于项目中3D内容的材质。请参阅 材质 (Materials)。

  • 可用于向工程添加效果的渲染通道。请参阅 渲染通道。

要在 Kanzi Studio 工程中使用 Factory Content 资产,请从 Asset Packages 将资产拖到 Node Tree 中的节点、Prefabs 或 Preview。请参阅 使用 Factory Content 资产。

../../_images/asset-packages-factory-content-selected.png

交互性控件组件

使用 2D 交互控制组件使您的应用程序具有交互性。

Button

使用 Button 创建一个接收用户输入的按钮。

../../_images/button.gif

要调整 Button 的外观和行为,在将 Button 添加到您的项目后,在 Properties 中设置:

  • Label 用于设置按钮中的文本。

  • Main Color 设置按钮背景的颜色。

  • Highlight Color 用于设置用户按下按钮时按钮背景的颜色。

  • Border Color 用于设置用户按下按钮时可见的按钮边框颜色。

  • Border Thickness 用于设置用户按下按钮时可见的按钮边框宽度。

  • Rounding Radius 用于设置按钮角的圆度。

    例如,要使按钮的角为直角,请将 Rounding Radius 设置为 0。

../../_images/button-properties.png

在 Node Components 中,使用触发器和动作来设置按钮对用户输入的反应。请参阅 使用 Button 节点 和 使用触发器。

Button 使用状态管理器来设置 Button 的外观和行为,当:

  • 用户按下按钮。

  • Enabled 属性的值发生变化。

    当您在 Button 节点中禁用 Enabled 属性时,按钮不会对用户输入做出反应。

    ../../_images/node-enabled-disabled.png

Checkbox

使用 Checkbox 创建一个接收用户输入的复选框。

../../_images/checkbox.gif

Checkbox 使用状态管理器来设置 Checkbox 的外观和行为,当:

  • 用户切换复选框。

  • Enabled 属性的值发生变化。

    当您在 Checkbox 节点中禁用 Enabled 属性时,复选框不会对用户输入做出反应。

    ../../_images/node-enabled-disabled.png

Radio Buttons

使用 Radio Buttons 创建接收用户输入的单选按钮。

../../_images/radio-buttons.gif

在 Node Components 中,使用触发器和动作来设置单选按钮如何响应用户输入。请参阅 使用 Button 节点 和 使用触发器。

Slider

使用 Slider 创建一个接收用户输入的滑块。

../../_images/slider1.gif

要调整 Slider 的外观和行为,在将 Slider 添加到您的项目后,在 Properties 中设置:

  • Maximum Value 用于设置滑块的最高值。默认值为 100。

  • Minimum Value 设置滑块的最低值。默认值为 0。

  • Step Value 用于设置旋钮在轨道上移动的增量。默认值为 1。

  • Value 用于设置旋钮在轨道上的初始位置。您可以使用绑定通过滑块的位置来控制另一个属性。请参阅 使用绑定。

  • Knob Style 用于将旋钮的形状设置为方形或圆形,或不显示旋钮。

  • Knob Size 设置旋钮的大小。

  • Knob Color 设置旋钮的颜色。

  • Rail Thickness 设置导轨的厚度。

  • Rail Rounded Ends 用于设置是否对轨道的末端进行圆角处理。

  • Rail Background Color 用于设置从旋钮到轨道末端的轨道颜色。

  • Rail Fill Color 用于设置从轨道起始位置到旋钮的轨道颜色。

../../_images/slider-range-properties1.png ../../_images/slider-properties.png

Slider 使用状态管理器来设置滑块的外观和行为,当 Enabled 属性的值发生变化时。 当您在 Slider 节点中禁用 Enabled 属性时,滑块不会对用户输入做出反应。

../../_images/node-enabled-disabled.png

Toggle Button

使用 Toggle Button 创建一个接收用户输入的切换按钮。

../../_images/toggle-button.gif

Toggle Button 使用状态管理器来设置 Toggle Button 的外观,当用户切换它时。

在 Node Components 中,使用触发器和动作来设置切换按钮对用户输入的反应。请参阅 使用 Toggle Button 节点 和 使用触发器。

进度组件

使用进度组件来显示任务正在进行中。

Processing Indicator

使用 Processing Indicator 来显示应用程序正在处理任务。

../../_images/processing-indicator.gif

要调整 Processing Indicator 的外观,在将 Processing Indicator 添加到您的项目后,在 Properties 中设置:

  • Color 用于设置处理指示器的颜色。

  • Masked 用于设置是否使用通过 Masking Texture 属性设置的纹理来遮罩处理指示器。

  • 将 Masking Texture 到一个纹理,以用于遮罩处理指示器。

    在遮罩纹理中:

    • 黑色像素形成了隐藏处理指示器区域的遮罩。

    • 白色像素形成了掩码中的间隙,显示了处理指示器的区域。

    默认情况下,Processing Indicator 被显示圆环的纹理遮罩。

  • Offset 设置处理指示器的旋转角度。

  • Step Count 设置处理指示器中的段数。

../../_images/processing-indicator-properties.png

Progress Bar

使用 Progress Bar 以视觉和百分比的形式显示任务正在进行中。

../../_images/progress-bar.gif

要设置 Progress Bar 的值,在 Properties 中设置 Progress 属性的值。您可以使用绑定来控制 Progress 属性。请参阅 使用绑定。

要在进度条的末端设置渐变的长度,在 Properties 中设置 Smoothing 属性的值。

../../_images/progress-bar-properties.png

Progress Indicator

使用 Progress Indicator 来显示任务正在进行中,以视觉和百分比的形式表示。

../../_images/progress-indicator.gif

要设置 Progress Indicator 的值,在 Properties 中设置 Progress 属性的值。您可以使用绑定来控制 Progress 属性。请参阅 使用绑定。

要调整 Progress Indicator 的外观,在将 Progress Indicator 添加到您的项目后,在 Properties 中设置:

  • Brush Color 用于设置进度指示器环的颜色。

  • Progress Smoothness 用于设置进度指示器末端渐变的长度。

  • Ring Smoothness 用于设置进度指示器环的边缘平滑度。

  • Ring Thickness 设置进度指示器环的宽度。

../../_images/progress-indicator-brush-color.png ../../_images/progress-indicator-properties1.png

列出组件

使用列表组件来展示排列在可滚动列表中的项目集合。

每个列表组件使用 List Box 节点来排列其项目。请参阅 List Box nodes。

使用数据源在列表组件中显示您自己的数据。请参阅 使用数据源 和 教程:从数据源获取应用程序数据。

Contact List

使用 Contact List 创建一个联系人列表,显示每个联系人的姓名、头像和电话号码。

../../_images/contact-list.gif

要设置 Contact List 的内容和行为,在 Properties 中添加并设置:

  • Items Source 提供列表项的数据源。

  • Selection Behavior 用于设置当用户选择某个项目时,列表框是否将该项目移至列表框区域的中心。

../../_images/items-source-property.png ../../_images/selection-behavior-property.png

Cover Flow

使用 Cover Flow 来展示专辑封面。

../../_images/cover-flow.gif

要设置 Cover Flow 的内容和行为,在 Node Tree 或 Prefabs 中选择 Cover Flow > Scene > Trajectory List Box 3D 节点,并在 Properties 中添加和设置:

  • Items Source 提供列表项的数据源。

  • Selection Behavior 用于设置当用户选择某个项目时,列表框是否将该项目移至列表框区域的中心。

../../_images/items-source-property.png ../../_images/selection-behavior-property.png

Poster Flow

使用 Poster Flow 来展示媒体海报。

../../_images/poster-flow.gif

要调整海报角的圆度, 在 Prefabs 中选择 Poster 预设,并在 Properties 中设置 Rounding Radius 属性。

../../_images/poster-flow-rounding-radius.png

要设置 Poster Flow 的内容和行为,在 Node Tree 或 Prefabs 中选择 Poster Flow > Scene > Trajectory List Box 3D 节点,并在 Properties 中添加和设置:

  • Items Source 提供列表项的数据源。

  • Selection Behavior 用于设置当用户选择某个项目时,列表框是否将该项目移至列表框区域的中心。

../../_images/items-source-property.png ../../_images/selection-behavior-property.png

完整的用户界面组件

Factory Content 包含完整的用户界面组件,您可以使用这些组件为您的应用程序添加功能。

Car

使用 Car 添加汽车模型。

../../_images/car-asset.png

要定位汽车,在 Preview 中使用 Node tool 或 Camera tool。请参阅 在 Preview 中编辑您的应用程序。 和 使用 Camera 节点。

要为汽车的不同部件设置材质,您可以将材质从 Assets 窗口拖到 Preview 窗口中的 Car。请参阅 使用 Factory Content 资产。

Music Player

使用 Music Player 创建一个带有接收用户输入按钮的音乐播放器。

../../_images/music-player.gif

在 Node Components 中,使用触发器和动作来设置 Music Player 按钮对用户输入的反应。请参阅 使用触发器。

Notification Popup

使用 Notification Popup 创建一个带有接收用户输入按钮的通知对话框。

../../_images/notification-popup.gif

在 Node Components 中,使用触发器和动作来设置 Notification Popup 按钮对用户输入的反应。请参阅 使用触发器。

Traditional Gauges

使用 Traditional Gauges 创建一个包含速度、转速、燃料和温度表的汽车集群。

../../_images/traditional-gauges.gif

要控制速度和转速表的可见性,在 Properties 中添加并设置 Gauge State 属性。

要移动指示器,在 Properties 中添加并设置:

  • Fuel 以移动燃料指示器。

  • RPM 以移动 RPM 指示器。

  • Speed 移动速度指示器。

  • Temperature 以移动温度指示器。

../../_images/gauges-properties.png

材质 (Materials)

Factory Content 包含可应用于项目中3D内容的材质。

../../_images/aluminium.png

Aluminium Material

使用标准图纹理。

../../_images/car-paint-material.png

Car Paint Material

../../_images/carbon-fiber-material.png

Carbon Fiber Material

使用标准图纹理。

../../_images/chrome-material.png

Chrome Material

../../_images/glass-material.png

Glass Material

../../_images/leather-material.png

Leather Material

使用标准图纹理。

../../_images/mask-texture-material.png

Mask Texture Material

../../_images/rubber-material.png

Rubber Material

使用标准图纹理。

要了解在您的 Kanzi 应用程序中使用 Factory Content 材料,请参阅 在您的项目中使用 Factory Content 材料。。

渲染通道

Factory Content 包含可用于向工程添加效果的渲染通道。

Skybox 渲染通道

使用 Skybox 渲染通道将 Cubemap 作为背景绘制到 Scene 中。

../../_images/skybox-asset.gif

设置 Skybox 渲染通道

  • 在 Asset Packages > Factory Content 中,右键单击 Skybox 并选择 Import,将该包作为预设件导入到 Library > Render Pass Prefabs 文件夹中。

  • 如果您的 Viewport 2D 中没有选定自定义 Render Pass Prefab,请在 Library > Rendering > Render Pass Prefabs 中右键单击并选择 Create > Default render pass。在 Viewport 2D 的 Properties 中,将 Default 渲染通道设置为 Render Pass Prefab 属性的值。

  • 在 Library > Rendering > Render Pass Prefabs 中,将 Skybox 渲染通道从其根节点拖到分配给目标 Viewport 2D 的 Render Pass Prefab 的 Draw Objects Opaque 节点下。

  • 要调整 Skybox 背景,请选择上一步中的 Skybox Render Pass View 并调整其属性。

    • 要调整背景的颜色,请调整 CubemapColor 属性。

    • 要选择背景立方体贴图纹理,请使用 TextureCube 属性。

    • 要覆盖跟踪摄像机,请使用 Override Camera 属性。

    • 要调整背景的方向,请使用 Skybox Orientation 属性。

../../_images/skybox-properties.png

另请参阅

使用 Factory Content 资产

资产包

使用绑定

3D 资产 (3D Assets)

材质类型和材质

教程:材料和纹理

使用节点预设