Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Update shell.md | clarify the use of the OnPlatform markup extension #2717

Merged
merged 3 commits into from
Jan 10, 2025
Merged

Update shell.md | clarify the use of the OnPlatform markup extension #2717

Changes from all commits
Commits
Show all changes
3 commits
Select commit Hold shift + click to select a range
ed33ef9
Update shell.md | Clarifying about OnPlatform markup extension
bhavanesh2001 Jan 10, 2025
d18269c
Fix typo and clarify `OnPlatform` usage
davidbritch Jan 10, 2025
7c61159
Merge branch 'main' into patch-1
davidbritch Jan 10, 2025
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
2 changes: 1 addition & 1 deletion docs/tutorials/notes-app/includes/shell.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -132,7 +132,7 @@ Let's break down the key parts of the XAML:
- `<TabBar>` is the content of the <xref:Microsoft.Maui.Controls.Shell>.
- Two `<ShellContent>` objects inside of the `<TabBar>`. Before you replaced the template code, there was a single `<ShellContent>` object, pointing to the `MainPage` page.

The `TabBar` and its children don't represent any user interface elements, but rather the organization of the app's visual hierarchy. Shell takes these objects and produces the user interface for the content, with a bar at the top representing each page. The `ShellContent.Icon` property for each page uses special syntax: `{OnPlatform ...}`. This syntax is processed when the XAML pages are compiled for each platform, and with it you can specify a property value for each platform. In this case, every platform uses the `icon_about.png` icon by default, but iOS and MacCatalyst will use `icon_about_ios.png`.
The `TabBar` and its children don't represent any user interface elements, but rather the organization of the app's visual hierarchy. Shell takes these objects and produces the user interface for the content, with a bar at the top representing each page. The `ShellContent.Icon` property for each page uses the `OnPlatform` markup extension. This XAML markup extension is used to specify different values for different platforms. In this example, every platform uses the `icon_about.png` icon by default, but iOS and MacCatalyst use `icon_about_ios.png`.

Each `<ShellContent>` object is pointing to a page to display. This is set by the `ContentTemplate` property.

Expand Down
Loading