Files
SwiftLint/accessibility_label_for_image.html
2025-06-22 14:27:57 +00:00

771 lines
65 KiB
HTML
Raw Permalink Blame History

This file contains ambiguous Unicode characters
This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.
<!DOCTYPE html>
<html lang="en">
<head>
<title>accessibility_label_for_image Reference</title>
<link rel="stylesheet" type="text/css" href="css/jazzy.css" />
<link rel="stylesheet" type="text/css" href="css/highlight.css" />
<meta charset="utf-8">
<script src="js/jquery.min.js" defer></script>
<script src="js/jazzy.js" defer></script>
<script src="js/lunr.min.js" defer></script>
<script src="js/typeahead.jquery.js" defer></script>
<script src="js/jazzy.search.js" defer></script>
</head>
<body>
<a title="accessibility_label_for_image Reference"></a>
<header class="header">
<p class="header-col header-col--primary">
<a class="header-link" href="index.html">
SwiftLintCore 0.59.1 Docs
</a>
(100% documented)
</p>
<div class="header-col--secondary">
<form role="search" action="search.json">
<input type="text" placeholder="Search documentation" data-typeahead>
</form>
</div>
<p class="header-col header-col--secondary">
<a class="header-link" href="https://github.com/realm/SwiftLint">
<img class="header-icon" src="img/gh.png" alt="GitHub"/>
View on GitHub
</a>
</p>
<p class="header-col header-col--secondary">
<a class="header-link" href="dash-feed://https%3A%2F%2Frealm.github.io%2FSwiftLint%2Fdocsets%2FSwiftLintCore.xml">
<img class="header-icon" src="img/dash.png" alt="Dash"/>
Install in Dash
</a>
</p>
</header>
<p class="breadcrumbs">
<a class="breadcrumb" href="index.html">SwiftLintCore</a>
<img class="carat" src="img/carat.png" alt=""/>
<a class="breadcrumb" href="Guides.html">Guides</a>
<img class="carat" src="img/carat.png" alt=""/>
accessibility_label_for_image Reference
</p>
<div class="content-wrapper">
<nav class="navigation">
<ul class="nav-groups">
<li class="nav-group-name">
<a class="nav-group-name-link" href="Rules.html">Rules</a>
<ul class="nav-group-tasks">
<li class="nav-group-task">
<a class="nav-group-task-link" href="rule-directory.html">Rule Directory</a>
</li>
</ul>
</li>
<li class="nav-group-name">
<a class="nav-group-name-link" href="Classes.html">Classes</a>
<ul class="nav-group-tasks">
<li class="nav-group-task">
<a class="nav-group-task-link" href="Classes/BodyLengthVisitor.html">BodyLengthVisitor</a>
</li>
<li class="nav-group-task">
<a class="nav-group-task-link" href="Classes/CodeBlockVisitor.html">CodeBlockVisitor</a>
</li>
<li class="nav-group-task">
<a class="nav-group-task-link" href="Classes/CodeIndentingRewriter.html">CodeIndentingRewriter</a>
</li>
<li class="nav-group-task">
<a class="nav-group-task-link" href="Classes/CodeIndentingRewriter/IndentationStyle.html"> IndentationStyle</a>
</li>
<li class="nav-group-task">
<a class="nav-group-task-link" href="Classes/DeclaredIdentifiersTrackingVisitor.html">DeclaredIdentifiersTrackingVisitor</a>
</li>
<li class="nav-group-task">
<a class="nav-group-task-link" href="Classes/RuleRegistry.html">RuleRegistry</a>
</li>
<li class="nav-group-task">
<a class="nav-group-task-link" href="Classes/RuleStorage.html">RuleStorage</a>
</li>
<li class="nav-group-task">
<a class="nav-group-task-link" href="Classes/SwiftLintFile.html">SwiftLintFile</a>
</li>
<li class="nav-group-task">
<a class="nav-group-task-link" href="Classes/ViolationsSyntaxRewriter.html">ViolationsSyntaxRewriter</a>
</li>
<li class="nav-group-task">
<a class="nav-group-task-link" href="Classes/ViolationsSyntaxVisitor.html">ViolationsSyntaxVisitor</a>
</li>
</ul>
</li>
<li class="nav-group-name">
<a class="nav-group-name-link" href="Enums.html">Enumerations</a>
<ul class="nav-group-tasks">
<li class="nav-group-task">
<a class="nav-group-task-link" href="Enums/AccessControlLevel.html">AccessControlLevel</a>
</li>
<li class="nav-group-task">
<a class="nav-group-task-link" href="Enums/CurrentRule.html">CurrentRule</a>
</li>
<li class="nav-group-task">
<a class="nav-group-task-link" href="Enums/IdentifierDeclaration.html">IdentifierDeclaration</a>
</li>
<li class="nav-group-task">
<a class="nav-group-task-link" href="Enums/Issue.html">Issue</a>
</li>
<li class="nav-group-task">
<a class="nav-group-task-link" href="Enums/OptionType.html">OptionType</a>
</li>
<li class="nav-group-task">
<a class="nav-group-task-link" href="Enums/RuleIdentifier.html">RuleIdentifier</a>
</li>
<li class="nav-group-task">
<a class="nav-group-task-link" href="Enums/RuleKind.html">RuleKind</a>
</li>
<li class="nav-group-task">
<a class="nav-group-task-link" href="Enums/RuleListError.html">RuleListError</a>
</li>
<li class="nav-group-task">
<a class="nav-group-task-link" href="Enums/SwiftExpressionKind.html">SwiftExpressionKind</a>
</li>
<li class="nav-group-task">
<a class="nav-group-task-link" href="Enums/SwiftSyntaxKindBridge.html">SwiftSyntaxKindBridge</a>
</li>
<li class="nav-group-task">
<a class="nav-group-task-link" href="Enums/ViolationSeverity.html">ViolationSeverity</a>
</li>
</ul>
</li>
<li class="nav-group-name">
<a class="nav-group-name-link" href="Extensions.html">Extensions</a>
<ul class="nav-group-tasks">
<li class="nav-group-task">
<a class="nav-group-task-link" href="Extensions/Array.html">Array</a>
</li>
<li class="nav-group-task">
<a class="nav-group-task-link" href="Extensions/Bool.html">Bool</a>
</li>
<li class="nav-group-task">
<a class="nav-group-task-link" href="Extensions/Double.html">Double</a>
</li>
<li class="nav-group-task">
<a class="nav-group-task-link" href="Extensions/Int.html">Int</a>
</li>
<li class="nav-group-task">
<a class="nav-group-task-link" href="Extensions/Optional.html">Optional</a>
</li>
<li class="nav-group-task">
<a class="nav-group-task-link" href="Extensions/Set.html">Set</a>
</li>
<li class="nav-group-task">
<a class="nav-group-task-link" href="Extensions/String.html">String</a>
</li>
</ul>
</li>
<li class="nav-group-name">
<a class="nav-group-name-link" href="Protocols.html">Protocols</a>
<ul class="nav-group-tasks">
<li class="nav-group-task">
<a class="nav-group-task-link" href="Protocols/ASTRule.html">ASTRule</a>
</li>
<li class="nav-group-task">
<a class="nav-group-task-link" href="Protocols/AcceptableByConfigurationElement.html">AcceptableByConfigurationElement</a>
</li>
<li class="nav-group-task">
<a class="nav-group-task-link" href="Protocols/AnalyzerRule.html">AnalyzerRule</a>
</li>
<li class="nav-group-task">
<a class="nav-group-task-link" href="Protocols.html#/s:13SwiftLintCore17AnyCollectingRuleP">AnyCollectingRule</a>
</li>
<li class="nav-group-task">
<a class="nav-group-task-link" href="Protocols/CacheDescriptionProvider.html">CacheDescriptionProvider</a>
</li>
<li class="nav-group-task">
<a class="nav-group-task-link" href="Protocols/CollectingRule.html">CollectingRule</a>
</li>
<li class="nav-group-task">
<a class="nav-group-task-link" href="Protocols/ConditionallySourceKitFree.html">ConditionallySourceKitFree</a>
</li>
<li class="nav-group-task">
<a class="nav-group-task-link" href="Protocols/CorrectableRule.html">CorrectableRule</a>
</li>
<li class="nav-group-task">
<a class="nav-group-task-link" href="Protocols/Documentable.html">Documentable</a>
</li>
<li class="nav-group-task">
<a class="nav-group-task-link" href="Protocols.html#/s:13SwiftLintCore19InlinableOptionTypeP">InlinableOptionType</a>
</li>
<li class="nav-group-task">
<a class="nav-group-task-link" href="Protocols.html#/s:13SwiftLintCore9OptInRuleP">OptInRule</a>
</li>
<li class="nav-group-task">
<a class="nav-group-task-link" href="Protocols/Rule.html">Rule</a>
</li>
<li class="nav-group-task">
<a class="nav-group-task-link" href="Protocols/RuleConfiguration.html">RuleConfiguration</a>
</li>
<li class="nav-group-task">
<a class="nav-group-task-link" href="Protocols/SeverityBasedRuleConfiguration.html">SeverityBasedRuleConfiguration</a>
</li>
<li class="nav-group-task">
<a class="nav-group-task-link" href="Protocols.html#/s:13SwiftLintCore17SourceKitFreeRuleP">SourceKitFreeRule</a>
</li>
<li class="nav-group-task">
<a class="nav-group-task-link" href="Protocols/SubstitutionCorrectableRule.html">SubstitutionCorrectableRule</a>
</li>
<li class="nav-group-task">
<a class="nav-group-task-link" href="Protocols/SwiftSyntaxCorrectableRule.html">SwiftSyntaxCorrectableRule</a>
</li>
<li class="nav-group-task">
<a class="nav-group-task-link" href="Protocols/SwiftSyntaxRule.html">SwiftSyntaxRule</a>
</li>
<li class="nav-group-task">
<a class="nav-group-task-link" href="Protocols/VersionComparable.html">VersionComparable</a>
</li>
</ul>
</li>
<li class="nav-group-name">
<a class="nav-group-name-link" href="Structs.html">Structures</a>
<ul class="nav-group-tasks">
<li class="nav-group-task">
<a class="nav-group-task-link" href="Structs/Baseline.html">Baseline</a>
</li>
<li class="nav-group-task">
<a class="nav-group-task-link" href="Structs/ChildOptionSeverityConfiguration.html">ChildOptionSeverityConfiguration</a>
</li>
<li class="nav-group-task">
<a class="nav-group-task-link" href="Structs/Command.html">Command</a>
</li>
<li class="nav-group-task">
<a class="nav-group-task-link" href="Structs/Command/Action.html"> Action</a>
</li>
<li class="nav-group-task">
<a class="nav-group-task-link" href="Structs/Command/Modifier.html"> Modifier</a>
</li>
<li class="nav-group-task">
<a class="nav-group-task-link" href="Structs/ConfigurationElement.html">ConfigurationElement</a>
</li>
<li class="nav-group-task">
<a class="nav-group-task-link" href="Structs/ConfigurationElement/DeprecationNotice.html"> DeprecationNotice</a>
</li>
<li class="nav-group-task">
<a class="nav-group-task-link" href="Structs/Correction.html">Correction</a>
</li>
<li class="nav-group-task">
<a class="nav-group-task-link" href="Structs/Example.html">Example</a>
</li>
<li class="nav-group-task">
<a class="nav-group-task-link" href="Structs/Location.html">Location</a>
</li>
<li class="nav-group-task">
<a class="nav-group-task-link" href="Structs/ReasonedRuleViolation.html">ReasonedRuleViolation</a>
</li>
<li class="nav-group-task">
<a class="nav-group-task-link" href="Structs/ReasonedRuleViolation/ViolationCorrection.html"> ViolationCorrection</a>
</li>
<li class="nav-group-task">
<a class="nav-group-task-link" href="Structs/RegexConfiguration.html">RegexConfiguration</a>
</li>
<li class="nav-group-task">
<a class="nav-group-task-link" href="Structs/RegexConfiguration/ExecutionMode.html"> ExecutionMode</a>
</li>
<li class="nav-group-task">
<a class="nav-group-task-link" href="Structs/Region.html">Region</a>
</li>
<li class="nav-group-task">
<a class="nav-group-task-link" href="Structs/RuleConfigurationDescription.html">RuleConfigurationDescription</a>
</li>
<li class="nav-group-task">
<a class="nav-group-task-link" href="Structs.html#/s:13SwiftLintCore35RuleConfigurationDescriptionBuilderV">RuleConfigurationDescriptionBuilder</a>
</li>
<li class="nav-group-task">
<a class="nav-group-task-link" href="Structs/RuleConfigurationOption.html">RuleConfigurationOption</a>
</li>
<li class="nav-group-task">
<a class="nav-group-task-link" href="Structs/RuleDescription.html">RuleDescription</a>
</li>
<li class="nav-group-task">
<a class="nav-group-task-link" href="Structs/RuleList.html">RuleList</a>
</li>
<li class="nav-group-task">
<a class="nav-group-task-link" href="Structs/RuleParameter.html">RuleParameter</a>
</li>
<li class="nav-group-task">
<a class="nav-group-task-link" href="Structs/SeverityConfiguration.html">SeverityConfiguration</a>
</li>
<li class="nav-group-task">
<a class="nav-group-task-link" href="Structs/SeverityLevelsConfiguration.html">SeverityLevelsConfiguration</a>
</li>
<li class="nav-group-task">
<a class="nav-group-task-link" href="Structs/Stack.html">Stack</a>
</li>
<li class="nav-group-task">
<a class="nav-group-task-link" href="Structs/StyleViolation.html">StyleViolation</a>
</li>
<li class="nav-group-task">
<a class="nav-group-task-link" href="Structs/SwiftLintSyntaxMap.html">SwiftLintSyntaxMap</a>
</li>
<li class="nav-group-task">
<a class="nav-group-task-link" href="Structs/SwiftLintSyntaxToken.html">SwiftLintSyntaxToken</a>
</li>
<li class="nav-group-task">
<a class="nav-group-task-link" href="Structs/SwiftVersion.html">SwiftVersion</a>
</li>
</ul>
</li>
<li class="nav-group-name">
<a class="nav-group-name-link" href="Macros.html">Macros</a>
<ul class="nav-group-tasks">
<li class="nav-group-task">
<a class="nav-group-task-link" href="Macros.html#/s:13SwiftLintCore32AcceptableByConfigurationElementyycfm">AcceptableByConfigurationElement()</a>
</li>
<li class="nav-group-task">
<a class="nav-group-task-link" href="Macros.html#/s:13SwiftLintCore16AutoConfigParseryycfm">AutoConfigParser()</a>
</li>
<li class="nav-group-task">
<a class="nav-group-task-link" href="Macros.html#/s:13SwiftLintCore0A10SyntaxRule15foldExpressions16explicitRewriter11correctable5optInySb_S3btcfm">SwiftSyntaxRule(foldExpressions:explicitRewriter:correctable:optIn:)</a>
</li>
</ul>
</li>
</ul>
</nav>
<article class="main-content">
<section class="section">
<div class="section-content top-matter">
<h1 id='accessibility-label-for-image' class='heading'>Accessibility Label for Image</h1>
<p>Images that provide context should have an accessibility label or should be explicitly hidden from accessibility</p>
<ul>
<li><strong>Identifier:</strong> <code>accessibility_label_for_image</code></li>
<li><strong>Enabled by default:</strong> No</li>
<li><strong>Supports autocorrection:</strong> No</li>
<li><strong>Kind:</strong> lint</li>
<li><strong>Analyzer rule:</strong> No</li>
<li><strong>Minimum Swift compiler version:</strong> 5.1.0</li>
<li><strong>Default configuration:</strong>
<table>
<thead>
<tr><th>Key</th><th>Value</th></tr>
</thead>
<tbody>
<tr>
<td>
severity
</td>
<td>
warning
</td>
</tr>
</tbody>
</table></li>
</ul>
<h2 id='rationale' class='heading'>Rationale</h2>
<p>In UIKit, a <code>UIImageView</code> was by default not an accessibility element, and would only be visible to VoiceOver and other assistive technologies if the developer explicitly made them an accessibility element. In SwiftUI, however, an <code>Image</code> is an accessibility element by default. If the developer does not explicitly hide them from accessibility or give them an accessibility label, they will inherit the name of the image file, which often creates a poor experience when VoiceOver reads things like &ldquo;close icon white&rdquo;.</p>
<p>Known false negatives for Images declared as instance variables and containers that provide a label but are not accessibility elements. Known false positives for Images created in a separate function from where they have accessibility properties applied.</p>
<h2 id='non-triggering-examples' class='heading'>Non Triggering Examples</h2>
<pre class="highlight swift"><code><span class="kd">struct</span> <span class="kt">MyView</span><span class="p">:</span> <span class="kt">View</span> <span class="p">{</span>
<span class="k">var</span> <span class="nv">body</span><span class="p">:</span> <span class="kd">some</span> <span class="kt">View</span> <span class="p">{</span>
<span class="kt">Image</span><span class="p">(</span><span class="nv">decorative</span><span class="p">:</span> <span class="s">"my-image"</span><span class="p">)</span>
<span class="p">}</span>
<span class="p">}</span>
</code></pre>
<pre class="highlight swift"><code><span class="kd">struct</span> <span class="kt">MyView</span><span class="p">:</span> <span class="kt">View</span> <span class="p">{</span>
<span class="k">var</span> <span class="nv">body</span><span class="p">:</span> <span class="kd">some</span> <span class="kt">View</span> <span class="p">{</span>
<span class="kt">Image</span><span class="p">(</span><span class="s">"my-image"</span><span class="p">,</span> <span class="nv">label</span><span class="p">:</span> <span class="kt">Text</span><span class="p">(</span><span class="s">"Alt text for my image"</span><span class="p">))</span>
<span class="p">}</span>
<span class="p">}</span>
</code></pre>
<pre class="highlight swift"><code><span class="kd">struct</span> <span class="kt">MyView</span><span class="p">:</span> <span class="kt">View</span> <span class="p">{</span>
<span class="k">var</span> <span class="nv">body</span><span class="p">:</span> <span class="kd">some</span> <span class="kt">View</span> <span class="p">{</span>
<span class="kt">Image</span><span class="p">(</span><span class="s">"my-image"</span><span class="p">)</span>
<span class="o">.</span><span class="nf">accessibility</span><span class="p">(</span><span class="nv">hidden</span><span class="p">:</span> <span class="kc">true</span><span class="p">)</span>
<span class="p">}</span>
<span class="p">}</span>
</code></pre>
<pre class="highlight swift"><code><span class="kd">struct</span> <span class="kt">MyView</span><span class="p">:</span> <span class="kt">View</span> <span class="p">{</span>
<span class="k">var</span> <span class="nv">body</span><span class="p">:</span> <span class="kd">some</span> <span class="kt">View</span> <span class="p">{</span>
<span class="kt">Image</span><span class="p">(</span><span class="s">"my-image"</span><span class="p">)</span>
<span class="o">.</span><span class="nf">accessibilityHidden</span><span class="p">(</span><span class="kc">true</span><span class="p">)</span>
<span class="p">}</span>
<span class="p">}</span>
</code></pre>
<pre class="highlight swift"><code><span class="kd">struct</span> <span class="kt">MyView</span><span class="p">:</span> <span class="kt">View</span> <span class="p">{</span>
<span class="k">var</span> <span class="nv">body</span><span class="p">:</span> <span class="kd">some</span> <span class="kt">View</span> <span class="p">{</span>
<span class="kt">Image</span><span class="p">(</span><span class="s">"my-image"</span><span class="p">)</span>
<span class="o">.</span><span class="nf">accessibility</span><span class="p">(</span><span class="nv">label</span><span class="p">:</span> <span class="kt">Text</span><span class="p">(</span><span class="s">"Alt text for my image"</span><span class="p">))</span>
<span class="p">}</span>
<span class="p">}</span>
</code></pre>
<pre class="highlight swift"><code><span class="kd">struct</span> <span class="kt">MyView</span><span class="p">:</span> <span class="kt">View</span> <span class="p">{</span>
<span class="k">var</span> <span class="nv">body</span><span class="p">:</span> <span class="kd">some</span> <span class="kt">View</span> <span class="p">{</span>
<span class="kt">Image</span><span class="p">(</span><span class="s">"my-image"</span><span class="p">)</span>
<span class="o">.</span><span class="nf">accessibilityLabel</span><span class="p">(</span><span class="kt">Text</span><span class="p">(</span><span class="s">"Alt text for my image"</span><span class="p">))</span>
<span class="p">}</span>
<span class="p">}</span>
</code></pre>
<pre class="highlight swift"><code><span class="kd">struct</span> <span class="kt">MyView</span><span class="p">:</span> <span class="kt">View</span> <span class="p">{</span>
<span class="k">var</span> <span class="nv">body</span><span class="p">:</span> <span class="kd">some</span> <span class="kt">View</span> <span class="p">{</span>
<span class="kt">Image</span><span class="p">(</span><span class="nv">uiImage</span><span class="p">:</span> <span class="n">myUiImage</span><span class="p">)</span>
<span class="o">.</span><span class="nf">renderingMode</span><span class="p">(</span><span class="o">.</span><span class="n">template</span><span class="p">)</span>
<span class="o">.</span><span class="nf">foregroundColor</span><span class="p">(</span><span class="o">.</span><span class="n">blue</span><span class="p">)</span>
<span class="o">.</span><span class="nf">accessibilityHidden</span><span class="p">(</span><span class="kc">true</span><span class="p">)</span>
<span class="p">}</span>
<span class="p">}</span>
</code></pre>
<pre class="highlight swift"><code><span class="kd">struct</span> <span class="kt">MyView</span><span class="p">:</span> <span class="kt">View</span> <span class="p">{</span>
<span class="k">var</span> <span class="nv">body</span><span class="p">:</span> <span class="kd">some</span> <span class="kt">View</span> <span class="p">{</span>
<span class="kt">Image</span><span class="p">(</span><span class="nv">uiImage</span><span class="p">:</span> <span class="n">myUiImage</span><span class="p">)</span>
<span class="o">.</span><span class="nf">accessibilityLabel</span><span class="p">(</span><span class="kt">Text</span><span class="p">(</span><span class="s">"Alt text for my image"</span><span class="p">))</span>
<span class="p">}</span>
<span class="p">}</span>
</code></pre>
<pre class="highlight swift"><code><span class="kd">struct</span> <span class="kt">MyView</span><span class="p">:</span> <span class="kt">View</span> <span class="p">{</span>
<span class="k">var</span> <span class="nv">body</span><span class="p">:</span> <span class="kd">some</span> <span class="kt">View</span> <span class="p">{</span>
<span class="kt">SwiftUI</span><span class="o">.</span><span class="kt">Image</span><span class="p">(</span><span class="nv">uiImage</span><span class="p">:</span> <span class="s">"my-image"</span><span class="p">)</span><span class="o">.</span><span class="nf">resizable</span><span class="p">()</span><span class="o">.</span><span class="nf">accessibilityHidden</span><span class="p">(</span><span class="kc">true</span><span class="p">)</span>
<span class="p">}</span>
<span class="p">}</span>
</code></pre>
<pre class="highlight swift"><code><span class="kd">struct</span> <span class="kt">MyView</span><span class="p">:</span> <span class="kt">View</span> <span class="p">{</span>
<span class="k">var</span> <span class="nv">body</span><span class="p">:</span> <span class="kd">some</span> <span class="kt">View</span> <span class="p">{</span>
<span class="kt">VStack</span> <span class="p">{</span>
<span class="kt">Image</span><span class="p">(</span><span class="nv">decorative</span><span class="p">:</span> <span class="s">"my-image"</span><span class="p">)</span>
<span class="o">.</span><span class="nf">renderingMode</span><span class="p">(</span><span class="o">.</span><span class="n">template</span><span class="p">)</span>
<span class="o">.</span><span class="nf">foregroundColor</span><span class="p">(</span><span class="o">.</span><span class="n">blue</span><span class="p">)</span>
<span class="kt">Image</span><span class="p">(</span><span class="s">"my-image"</span><span class="p">)</span>
<span class="o">.</span><span class="nf">accessibility</span><span class="p">(</span><span class="nv">label</span><span class="p">:</span> <span class="kt">Text</span><span class="p">(</span><span class="s">"Alt text for my image"</span><span class="p">))</span>
<span class="p">}</span>
<span class="p">}</span>
<span class="p">}</span>
</code></pre>
<pre class="highlight swift"><code><span class="kd">struct</span> <span class="kt">MyView</span><span class="p">:</span> <span class="kt">View</span> <span class="p">{</span>
<span class="k">var</span> <span class="nv">body</span><span class="p">:</span> <span class="kd">some</span> <span class="kt">View</span> <span class="p">{</span>
<span class="kt">VStack</span> <span class="p">{</span>
<span class="kt">Image</span><span class="p">(</span><span class="s">"my-image"</span><span class="p">)</span>
<span class="o">.</span><span class="nf">renderingMode</span><span class="p">(</span><span class="o">.</span><span class="n">template</span><span class="p">)</span>
<span class="o">.</span><span class="nf">foregroundColor</span><span class="p">(</span><span class="o">.</span><span class="n">blue</span><span class="p">)</span>
<span class="kt">Image</span><span class="p">(</span><span class="s">"my-image"</span><span class="p">)</span>
<span class="o">.</span><span class="nf">accessibility</span><span class="p">(</span><span class="nv">label</span><span class="p">:</span> <span class="kt">Text</span><span class="p">(</span><span class="s">"Alt text for my image"</span><span class="p">))</span>
<span class="p">}</span><span class="o">.</span><span class="nf">accessibilityElement</span><span class="p">()</span>
<span class="p">}</span>
<span class="p">}</span>
</code></pre>
<pre class="highlight swift"><code><span class="kd">struct</span> <span class="kt">MyView</span><span class="p">:</span> <span class="kt">View</span> <span class="p">{</span>
<span class="k">var</span> <span class="nv">body</span><span class="p">:</span> <span class="kd">some</span> <span class="kt">View</span> <span class="p">{</span>
<span class="kt">VStack</span> <span class="p">{</span>
<span class="kt">Image</span><span class="p">(</span><span class="s">"my-image"</span><span class="p">)</span>
<span class="o">.</span><span class="nf">renderingMode</span><span class="p">(</span><span class="o">.</span><span class="n">template</span><span class="p">)</span>
<span class="o">.</span><span class="nf">foregroundColor</span><span class="p">(</span><span class="o">.</span><span class="n">blue</span><span class="p">)</span>
<span class="kt">Image</span><span class="p">(</span><span class="s">"my-image"</span><span class="p">)</span>
<span class="o">.</span><span class="nf">accessibility</span><span class="p">(</span><span class="nv">label</span><span class="p">:</span> <span class="kt">Text</span><span class="p">(</span><span class="s">"Alt text for my image"</span><span class="p">))</span>
<span class="p">}</span><span class="o">.</span><span class="nf">accessibilityHidden</span><span class="p">(</span><span class="kc">true</span><span class="p">)</span>
<span class="p">}</span>
<span class="p">}</span>
</code></pre>
<pre class="highlight swift"><code><span class="kd">struct</span> <span class="kt">MyView</span><span class="p">:</span> <span class="kt">View</span> <span class="p">{</span>
<span class="k">var</span> <span class="nv">body</span><span class="p">:</span> <span class="kd">some</span> <span class="kt">View</span> <span class="p">{</span>
<span class="kt">HStack</span><span class="p">(</span><span class="nv">spacing</span><span class="p">:</span> <span class="mi">8</span><span class="p">)</span> <span class="p">{</span>
<span class="kt">Image</span><span class="p">(</span><span class="nv">decorative</span><span class="p">:</span> <span class="s">"my-image"</span><span class="p">)</span>
<span class="o">.</span><span class="nf">renderingMode</span><span class="p">(</span><span class="o">.</span><span class="n">template</span><span class="p">)</span>
<span class="o">.</span><span class="nf">foregroundColor</span><span class="p">(</span><span class="o">.</span><span class="n">blue</span><span class="p">)</span>
<span class="kt">Text</span><span class="p">(</span><span class="s">"Text to accompany my image"</span><span class="p">)</span>
<span class="p">}</span><span class="o">.</span><span class="nf">accessibilityElement</span><span class="p">(</span><span class="nv">children</span><span class="p">:</span> <span class="o">.</span><span class="n">combine</span><span class="p">)</span>
<span class="o">.</span><span class="nf">padding</span><span class="p">(</span><span class="mi">16</span><span class="p">)</span>
<span class="p">}</span>
<span class="p">}</span>
</code></pre>
<pre class="highlight swift"><code><span class="kd">struct</span> <span class="kt">MyView</span><span class="p">:</span> <span class="kt">View</span> <span class="p">{</span>
<span class="k">var</span> <span class="nv">body</span><span class="p">:</span> <span class="kd">some</span> <span class="kt">View</span> <span class="p">{</span>
<span class="kt">HStack</span><span class="p">(</span><span class="nv">spacing</span><span class="p">:</span> <span class="mi">8</span><span class="p">)</span> <span class="p">{</span>
<span class="kt">Image</span><span class="p">(</span><span class="s">"my-image"</span><span class="p">)</span>
<span class="o">.</span><span class="nf">renderingMode</span><span class="p">(</span><span class="o">.</span><span class="n">template</span><span class="p">)</span>
<span class="o">.</span><span class="nf">foregroundColor</span><span class="p">(</span><span class="o">.</span><span class="n">blue</span><span class="p">)</span>
<span class="kt">Text</span><span class="p">(</span><span class="s">"Text to accompany my image"</span><span class="p">)</span>
<span class="p">}</span><span class="o">.</span><span class="nf">accessibilityElement</span><span class="p">(</span><span class="nv">children</span><span class="p">:</span> <span class="o">.</span><span class="n">ignore</span><span class="p">)</span>
<span class="o">.</span><span class="nf">padding</span><span class="p">(</span><span class="mi">16</span><span class="p">)</span>
<span class="o">.</span><span class="nf">accessibilityLabel</span><span class="p">(</span><span class="kt">Text</span><span class="p">(</span><span class="s">"Label for my image and text"</span><span class="p">))</span>
<span class="p">}</span>
<span class="p">}</span>
</code></pre>
<pre class="highlight swift"><code><span class="kd">struct</span> <span class="kt">MyView</span><span class="p">:</span> <span class="kt">View</span> <span class="p">{</span>
<span class="k">var</span> <span class="nv">body</span><span class="p">:</span> <span class="kd">some</span> <span class="kt">View</span> <span class="p">{</span>
<span class="kt">Button</span><span class="p">(</span><span class="nv">action</span><span class="p">:</span> <span class="p">{</span> <span class="nf">doAction</span><span class="p">()</span> <span class="p">})</span> <span class="p">{</span>
<span class="kt">Image</span><span class="p">(</span><span class="s">"my-image"</span><span class="p">)</span>
<span class="o">.</span><span class="nf">renderingMode</span><span class="p">(</span><span class="o">.</span><span class="n">template</span><span class="p">)</span>
<span class="o">.</span><span class="nf">foregroundColor</span><span class="p">(</span><span class="o">.</span><span class="n">blue</span><span class="p">)</span>
<span class="p">}</span>
<span class="o">.</span><span class="nf">accessibilityLabel</span><span class="p">(</span><span class="kt">Text</span><span class="p">(</span><span class="s">"Label for my image"</span><span class="p">))</span>
<span class="p">}</span>
<span class="p">}</span>
</code></pre>
<pre class="highlight swift"><code><span class="kd">struct</span> <span class="kt">MyView</span><span class="p">:</span> <span class="kt">View</span> <span class="p">{</span>
<span class="k">var</span> <span class="nv">body</span><span class="p">:</span> <span class="kd">some</span> <span class="kt">View</span> <span class="p">{</span>
<span class="kt">NavigationLink</span><span class="p">(</span><span class="s">"Go to Details"</span><span class="p">)</span> <span class="p">{</span>
<span class="kt">DetailView</span><span class="p">()</span>
<span class="p">}</span> <span class="nv">label</span><span class="p">:</span> <span class="p">{</span>
<span class="kt">HStack</span> <span class="p">{</span>
<span class="kt">Image</span><span class="p">(</span><span class="nv">systemName</span><span class="p">:</span> <span class="s">"arrow.right"</span><span class="p">)</span>
<span class="kt">Text</span><span class="p">(</span><span class="s">"Navigate Here"</span><span class="p">)</span>
<span class="p">}</span>
<span class="p">}</span>
<span class="p">}</span>
<span class="p">}</span>
</code></pre>
<pre class="highlight swift"><code><span class="kd">struct</span> <span class="kt">MyView</span><span class="p">:</span> <span class="kt">View</span> <span class="p">{</span>
<span class="k">var</span> <span class="nv">body</span><span class="p">:</span> <span class="kd">some</span> <span class="kt">View</span> <span class="p">{</span>
<span class="kt">Button</span><span class="p">(</span><span class="s">"Save Changes"</span><span class="p">)</span> <span class="p">{</span>
<span class="nf">saveAction</span><span class="p">()</span>
<span class="p">}</span> <span class="nv">label</span><span class="p">:</span> <span class="p">{</span>
<span class="kt">Label</span><span class="p">(</span><span class="s">"Save"</span><span class="p">,</span> <span class="nv">systemImage</span><span class="p">:</span> <span class="s">"square.and.arrow.down"</span><span class="p">)</span>
<span class="p">}</span>
<span class="p">}</span>
<span class="p">}</span>
</code></pre>
<pre class="highlight swift"><code><span class="kd">struct</span> <span class="kt">MyView</span><span class="p">:</span> <span class="kt">View</span> <span class="p">{</span>
<span class="k">var</span> <span class="nv">body</span><span class="p">:</span> <span class="kd">some</span> <span class="kt">View</span> <span class="p">{</span>
<span class="kt">Button</span><span class="p">(</span><span class="nv">action</span><span class="p">:</span> <span class="n">performAction</span><span class="p">)</span> <span class="p">{</span>
<span class="kt">HStack</span> <span class="p">{</span>
<span class="kt">Image</span><span class="p">(</span><span class="nv">uiImage</span><span class="p">:</span> <span class="kt">UIImage</span><span class="p">(</span><span class="nv">systemName</span><span class="p">:</span> <span class="s">"star"</span><span class="p">)</span> <span class="p">??</span> <span class="kt">UIImage</span><span class="p">())</span>
<span class="kt">Text</span><span class="p">(</span><span class="s">"Favorite"</span><span class="p">)</span>
<span class="p">}</span>
<span class="p">}</span>
<span class="o">.</span><span class="nf">accessibilityLabel</span><span class="p">(</span><span class="s">"Add to Favorites"</span><span class="p">)</span>
<span class="p">}</span>
<span class="p">}</span>
</code></pre>
<pre class="highlight swift"><code><span class="kd">struct</span> <span class="kt">MyView</span><span class="p">:</span> <span class="kt">View</span> <span class="p">{</span>
<span class="k">var</span> <span class="nv">body</span><span class="p">:</span> <span class="kd">some</span> <span class="kt">View</span> <span class="p">{</span>
<span class="kt">VStack</span> <span class="p">{</span>
<span class="kt">Image</span><span class="p">(</span><span class="nv">systemName</span><span class="p">:</span> <span class="s">"wifi"</span><span class="p">)</span>
<span class="kt">Image</span><span class="p">(</span><span class="s">"network-icon"</span><span class="p">)</span>
<span class="kt">Text</span><span class="p">(</span><span class="s">"Network Status"</span><span class="p">)</span>
<span class="p">}</span><span class="o">.</span><span class="nf">accessibilityElement</span><span class="p">(</span><span class="nv">children</span><span class="p">:</span> <span class="o">.</span><span class="n">ignore</span><span class="p">)</span>
<span class="o">.</span><span class="nf">accessibilityLabel</span><span class="p">(</span><span class="s">"Connected to WiFi"</span><span class="p">)</span>
<span class="p">}</span>
<span class="p">}</span>
</code></pre>
<pre class="highlight swift"><code><span class="kd">struct</span> <span class="kt">MyView</span><span class="p">:</span> <span class="kt">View</span> <span class="p">{</span>
<span class="k">let</span> <span class="nv">statusImage</span><span class="p">:</span> <span class="kt">UIImage</span>
<span class="k">var</span> <span class="nv">body</span><span class="p">:</span> <span class="kd">some</span> <span class="kt">View</span> <span class="p">{</span>
<span class="kt">HStack</span> <span class="p">{</span>
<span class="kt">Image</span><span class="p">(</span><span class="nv">uiImage</span><span class="p">:</span> <span class="n">statusImage</span><span class="p">)</span>
<span class="o">.</span><span class="nf">foregroundColor</span><span class="p">(</span><span class="o">.</span><span class="n">green</span><span class="p">)</span>
<span class="kt">Text</span><span class="p">(</span><span class="s">"System Status"</span><span class="p">)</span>
<span class="p">}</span><span class="o">.</span><span class="nf">accessibilityElement</span><span class="p">(</span><span class="nv">children</span><span class="p">:</span> <span class="o">.</span><span class="n">ignore</span><span class="p">)</span>
<span class="o">.</span><span class="nf">accessibilityLabel</span><span class="p">(</span><span class="s">"System is operational"</span><span class="p">)</span>
<span class="p">}</span>
<span class="p">}</span>
</code></pre>
<pre class="highlight swift"><code><span class="kd">struct</span> <span class="kt">MyView</span><span class="p">:</span> <span class="kt">View</span> <span class="p">{</span>
<span class="k">var</span> <span class="nv">body</span><span class="p">:</span> <span class="kd">some</span> <span class="kt">View</span> <span class="p">{</span>
<span class="kt">NavigationLink</span><span class="p">(</span><span class="nv">destination</span><span class="p">:</span> <span class="kt">SettingsView</span><span class="p">())</span> <span class="p">{</span>
<span class="kt">HStack</span> <span class="p">{</span>
<span class="kt">Image</span><span class="p">(</span><span class="nv">nsImage</span><span class="p">:</span> <span class="kt">NSImage</span><span class="p">(</span><span class="nv">named</span><span class="p">:</span> <span class="s">"gear"</span><span class="p">)</span> <span class="p">??</span> <span class="kt">NSImage</span><span class="p">())</span>
<span class="kt">Text</span><span class="p">(</span><span class="s">"Preferences"</span><span class="p">)</span>
<span class="kt">Spacer</span><span class="p">()</span>
<span class="kt">Image</span><span class="p">(</span><span class="nv">systemName</span><span class="p">:</span> <span class="s">"chevron.right"</span><span class="p">)</span>
<span class="p">}</span>
<span class="p">}</span>
<span class="p">}</span>
<span class="p">}</span>
</code></pre>
<pre class="highlight swift"><code><span class="kd">struct</span> <span class="kt">MyView</span><span class="p">:</span> <span class="kt">View</span> <span class="p">{</span>
<span class="k">var</span> <span class="nv">body</span><span class="p">:</span> <span class="kd">some</span> <span class="kt">View</span> <span class="p">{</span>
<span class="kt">Button</span> <span class="p">{</span>
<span class="nf">toggleState</span><span class="p">()</span>
<span class="p">}</span> <span class="nv">label</span><span class="p">:</span> <span class="p">{</span>
<span class="kt">Image</span><span class="p">(</span><span class="nv">systemName</span><span class="p">:</span> <span class="n">isEnabled</span> <span class="p">?</span> <span class="s">"eye"</span> <span class="p">:</span> <span class="s">"eye.slash"</span><span class="p">)</span>
<span class="o">.</span><span class="nf">foregroundColor</span><span class="p">(</span><span class="n">isEnabled</span> <span class="p">?</span> <span class="o">.</span><span class="nv">blue</span> <span class="p">:</span> <span class="o">.</span><span class="n">gray</span><span class="p">)</span>
<span class="p">}</span>
<span class="o">.</span><span class="nf">accessibilityLabel</span><span class="p">(</span><span class="n">isEnabled</span> <span class="p">?</span> <span class="s">"Hide content"</span> <span class="p">:</span> <span class="s">"Show content"</span><span class="p">)</span>
<span class="p">}</span>
<span class="p">}</span>
</code></pre>
<pre class="highlight swift"><code><span class="kd">struct</span> <span class="kt">CustomCard</span><span class="p">:</span> <span class="kt">View</span> <span class="p">{</span>
<span class="k">var</span> <span class="nv">body</span><span class="p">:</span> <span class="kd">some</span> <span class="kt">View</span> <span class="p">{</span>
<span class="kt">VStack</span> <span class="p">{</span>
<span class="kt">Image</span><span class="p">(</span><span class="s">"card-background"</span><span class="p">)</span>
<span class="kt">Image</span><span class="p">(</span><span class="nv">systemName</span><span class="p">:</span> <span class="s">"checkmark.circle"</span><span class="p">)</span>
<span class="kt">Text</span><span class="p">(</span><span class="s">"Task Complete"</span><span class="p">)</span>
<span class="p">}</span>
<span class="o">.</span><span class="nf">accessibilityElement</span><span class="p">(</span><span class="nv">children</span><span class="p">:</span> <span class="o">.</span><span class="n">ignore</span><span class="p">)</span>
<span class="o">.</span><span class="nf">accessibilityLabel</span><span class="p">(</span><span class="s">"Task completed successfully"</span><span class="p">)</span>
<span class="p">}</span>
<span class="p">}</span>
</code></pre>
<h2 id='triggering-examples' class='heading'>Triggering Examples</h2>
<pre class="highlight swift"><code><span class="kd">struct</span> <span class="kt">MyView</span><span class="p">:</span> <span class="kt">View</span> <span class="p">{</span>
<span class="k">var</span> <span class="nv">body</span><span class="p">:</span> <span class="kd">some</span> <span class="kt">View</span> <span class="p">{</span>
<span class="err"></span><span class="kt">Image</span><span class="p">(</span><span class="s">"my-image"</span><span class="p">)</span>
<span class="o">.</span><span class="nf">resizable</span><span class="p">(</span><span class="kc">true</span><span class="p">)</span>
<span class="o">.</span><span class="nf">frame</span><span class="p">(</span><span class="nv">width</span><span class="p">:</span> <span class="mi">48</span><span class="p">,</span> <span class="nv">height</span><span class="p">:</span> <span class="mi">48</span><span class="p">)</span>
<span class="p">}</span>
<span class="p">}</span>
</code></pre>
<pre class="highlight swift"><code><span class="kd">struct</span> <span class="kt">MyView</span><span class="p">:</span> <span class="kt">View</span> <span class="p">{</span>
<span class="k">var</span> <span class="nv">body</span><span class="p">:</span> <span class="kd">some</span> <span class="kt">View</span> <span class="p">{</span>
<span class="err"></span><span class="kt">Image</span><span class="p">(</span><span class="nv">uiImage</span><span class="p">:</span> <span class="n">myUiImage</span><span class="p">)</span>
<span class="p">}</span>
<span class="p">}</span>
</code></pre>
<pre class="highlight swift"><code><span class="kd">struct</span> <span class="kt">MyView</span><span class="p">:</span> <span class="kt">View</span> <span class="p">{</span>
<span class="k">var</span> <span class="nv">body</span><span class="p">:</span> <span class="kd">some</span> <span class="kt">View</span> <span class="p">{</span>
<span class="err"></span><span class="kt">SwiftUI</span><span class="o">.</span><span class="kt">Image</span><span class="p">(</span><span class="nv">uiImage</span><span class="p">:</span> <span class="s">"my-image"</span><span class="p">)</span><span class="o">.</span><span class="nf">resizable</span><span class="p">()</span><span class="o">.</span><span class="nf">accessibilityHidden</span><span class="p">(</span><span class="kc">false</span><span class="p">)</span>
<span class="p">}</span>
<span class="p">}</span>
</code></pre>
<pre class="highlight swift"><code><span class="kd">struct</span> <span class="kt">MyView</span><span class="p">:</span> <span class="kt">View</span> <span class="p">{</span>
<span class="k">var</span> <span class="nv">body</span><span class="p">:</span> <span class="kd">some</span> <span class="kt">View</span> <span class="p">{</span>
<span class="kt">Image</span><span class="p">(</span><span class="nv">uiImage</span><span class="p">:</span> <span class="n">myUiImage</span><span class="p">)</span>
<span class="o">.</span><span class="nf">resizable</span><span class="p">()</span>
<span class="o">.</span><span class="nf">frame</span><span class="p">(</span><span class="nv">width</span><span class="p">:</span> <span class="mi">48</span><span class="p">,</span> <span class="nv">height</span><span class="p">:</span> <span class="mi">48</span><span class="p">)</span>
<span class="o">.</span><span class="nf">accessibilityLabel</span><span class="p">(</span><span class="kt">Text</span><span class="p">(</span><span class="s">"Alt text for my image"</span><span class="p">))</span>
<span class="err"></span><span class="kt">Image</span><span class="p">(</span><span class="s">"other image"</span><span class="p">)</span>
<span class="p">}</span>
<span class="p">}</span>
</code></pre>
<pre class="highlight swift"><code><span class="kd">struct</span> <span class="kt">MyView</span><span class="p">:</span> <span class="kt">View</span> <span class="p">{</span>
<span class="k">var</span> <span class="nv">body</span><span class="p">:</span> <span class="kd">some</span> <span class="kt">View</span> <span class="p">{</span>
<span class="kt">Image</span><span class="p">(</span><span class="nv">decorative</span><span class="p">:</span> <span class="s">"image1"</span><span class="p">)</span>
<span class="err"></span><span class="kt">Image</span><span class="p">(</span><span class="s">"image2"</span><span class="p">)</span>
<span class="kt">Image</span><span class="p">(</span><span class="nv">uiImage</span><span class="p">:</span> <span class="s">"image3"</span><span class="p">)</span>
<span class="o">.</span><span class="nf">accessibility</span><span class="p">(</span><span class="nv">label</span><span class="p">:</span> <span class="kt">Text</span><span class="p">(</span><span class="s">"a pretty picture"</span><span class="p">))</span>
<span class="p">}</span>
<span class="p">}</span>
</code></pre>
<pre class="highlight swift"><code><span class="kd">struct</span> <span class="kt">MyView</span><span class="p">:</span> <span class="kt">View</span> <span class="p">{</span>
<span class="k">var</span> <span class="nv">body</span><span class="p">:</span> <span class="kd">some</span> <span class="kt">View</span> <span class="p">{</span>
<span class="kt">VStack</span> <span class="p">{</span>
<span class="kt">Image</span><span class="p">(</span><span class="nv">decorative</span><span class="p">:</span> <span class="s">"my-image"</span><span class="p">)</span>
<span class="o">.</span><span class="nf">renderingMode</span><span class="p">(</span><span class="o">.</span><span class="n">template</span><span class="p">)</span>
<span class="o">.</span><span class="nf">foregroundColor</span><span class="p">(</span><span class="o">.</span><span class="n">blue</span><span class="p">)</span>
<span class="err"></span><span class="kt">Image</span><span class="p">(</span><span class="s">"my-image"</span><span class="p">)</span>
<span class="p">}</span>
<span class="p">}</span>
<span class="p">}</span>
</code></pre>
<pre class="highlight swift"><code><span class="kd">struct</span> <span class="kt">MyView</span><span class="p">:</span> <span class="kt">View</span> <span class="p">{</span>
<span class="k">var</span> <span class="nv">body</span><span class="p">:</span> <span class="kd">some</span> <span class="kt">View</span> <span class="p">{</span>
<span class="kt">VStack</span> <span class="p">{</span>
<span class="err"></span><span class="kt">Image</span><span class="p">(</span><span class="s">"my-image"</span><span class="p">)</span>
<span class="o">.</span><span class="nf">renderingMode</span><span class="p">(</span><span class="o">.</span><span class="n">template</span><span class="p">)</span>
<span class="o">.</span><span class="nf">foregroundColor</span><span class="p">(</span><span class="o">.</span><span class="n">blue</span><span class="p">)</span>
<span class="kt">Image</span><span class="p">(</span><span class="s">"my-image"</span><span class="p">)</span>
<span class="o">.</span><span class="nf">accessibility</span><span class="p">(</span><span class="nv">label</span><span class="p">:</span> <span class="kt">Text</span><span class="p">(</span><span class="s">"Alt text for my image"</span><span class="p">))</span>
<span class="p">}</span><span class="o">.</span><span class="nf">accessibilityElement</span><span class="p">(</span><span class="nv">children</span><span class="p">:</span> <span class="o">.</span><span class="n">contain</span><span class="p">)</span>
<span class="p">}</span>
<span class="p">}</span>
</code></pre>
<pre class="highlight swift"><code><span class="kd">struct</span> <span class="kt">MyView</span><span class="p">:</span> <span class="kt">View</span> <span class="p">{</span>
<span class="k">var</span> <span class="nv">body</span><span class="p">:</span> <span class="kd">some</span> <span class="kt">View</span> <span class="p">{</span>
<span class="kt">VStack</span> <span class="p">{</span>
<span class="err"></span><span class="kt">Image</span><span class="p">(</span><span class="s">"my-image"</span><span class="p">)</span>
<span class="o">.</span><span class="nf">renderingMode</span><span class="p">(</span><span class="o">.</span><span class="n">template</span><span class="p">)</span>
<span class="o">.</span><span class="nf">foregroundColor</span><span class="p">(</span><span class="o">.</span><span class="n">blue</span><span class="p">)</span>
<span class="kt">Image</span><span class="p">(</span><span class="s">"my-image"</span><span class="p">)</span>
<span class="o">.</span><span class="nf">accessibility</span><span class="p">(</span><span class="nv">label</span><span class="p">:</span> <span class="kt">Text</span><span class="p">(</span><span class="s">"Alt text for my image"</span><span class="p">))</span>
<span class="p">}</span><span class="o">.</span><span class="nf">accessibilityHidden</span><span class="p">(</span><span class="kc">false</span><span class="p">)</span>
<span class="p">}</span>
<span class="p">}</span>
</code></pre>
<pre class="highlight swift"><code><span class="kd">struct</span> <span class="kt">MyView</span><span class="p">:</span> <span class="kt">View</span> <span class="p">{</span>
<span class="k">var</span> <span class="nv">body</span><span class="p">:</span> <span class="kd">some</span> <span class="kt">View</span> <span class="p">{</span>
<span class="kt">HStack</span><span class="p">(</span><span class="nv">spacing</span><span class="p">:</span> <span class="mi">8</span><span class="p">)</span> <span class="p">{</span>
<span class="err"></span><span class="kt">Image</span><span class="p">(</span><span class="s">"my-image"</span><span class="p">)</span>
<span class="o">.</span><span class="nf">renderingMode</span><span class="p">(</span><span class="o">.</span><span class="n">template</span><span class="p">)</span>
<span class="o">.</span><span class="nf">foregroundColor</span><span class="p">(</span><span class="o">.</span><span class="n">blue</span><span class="p">)</span>
<span class="kt">Text</span><span class="p">(</span><span class="s">"Text to accompany my image"</span><span class="p">)</span>
<span class="p">}</span><span class="o">.</span><span class="nf">accessibilityElement</span><span class="p">(</span><span class="nv">children</span><span class="p">:</span> <span class="o">.</span><span class="n">combine</span><span class="p">)</span>
<span class="o">.</span><span class="nf">padding</span><span class="p">(</span><span class="mi">16</span><span class="p">)</span>
<span class="p">}</span>
<span class="p">}</span>
</code></pre>
<pre class="highlight swift"><code><span class="kd">struct</span> <span class="kt">MyView</span><span class="p">:</span> <span class="kt">View</span> <span class="p">{</span>
<span class="k">var</span> <span class="nv">body</span><span class="p">:</span> <span class="kd">some</span> <span class="kt">View</span> <span class="p">{</span>
<span class="kt">Button</span><span class="p">(</span><span class="nv">action</span><span class="p">:</span> <span class="p">{</span> <span class="nf">doAction</span><span class="p">()</span> <span class="p">})</span> <span class="p">{</span>
<span class="err"></span><span class="kt">Image</span><span class="p">(</span><span class="s">"my-image"</span><span class="p">)</span>
<span class="o">.</span><span class="nf">renderingMode</span><span class="p">(</span><span class="o">.</span><span class="n">template</span><span class="p">)</span>
<span class="o">.</span><span class="nf">foregroundColor</span><span class="p">(</span><span class="o">.</span><span class="n">blue</span><span class="p">)</span>
<span class="p">}</span>
<span class="p">}</span>
<span class="p">}</span>
</code></pre>
<pre class="highlight swift"><code><span class="kd">struct</span> <span class="kt">MyView</span><span class="p">:</span> <span class="kt">View</span> <span class="p">{</span>
<span class="k">var</span> <span class="nv">body</span><span class="p">:</span> <span class="kd">some</span> <span class="kt">View</span> <span class="p">{</span>
<span class="err"></span><span class="kt">Image</span><span class="p">(</span><span class="nv">systemName</span><span class="p">:</span> <span class="s">"circle.plus"</span><span class="p">)</span>
<span class="p">}</span>
<span class="p">}</span>
</code></pre>
<pre class="highlight swift"><code><span class="kd">struct</span> <span class="kt">StatusView</span><span class="p">:</span> <span class="kt">View</span> <span class="p">{</span>
<span class="k">let</span> <span class="nv">statusIcon</span><span class="p">:</span> <span class="kt">UIImage</span>
<span class="k">var</span> <span class="nv">body</span><span class="p">:</span> <span class="kd">some</span> <span class="kt">View</span> <span class="p">{</span>
<span class="kt">HStack</span> <span class="p">{</span>
<span class="err"></span><span class="kt">Image</span><span class="p">(</span><span class="nv">uiImage</span><span class="p">:</span> <span class="n">statusIcon</span><span class="p">)</span>
<span class="o">.</span><span class="nf">foregroundColor</span><span class="p">(</span><span class="o">.</span><span class="n">green</span><span class="p">)</span>
<span class="kt">Text</span><span class="p">(</span><span class="s">"Status"</span><span class="p">)</span>
<span class="p">}</span>
<span class="p">}</span>
<span class="p">}</span>
</code></pre>
<pre class="highlight swift"><code><span class="kd">struct</span> <span class="kt">PreferencesView</span><span class="p">:</span> <span class="kt">View</span> <span class="p">{</span>
<span class="k">var</span> <span class="nv">body</span><span class="p">:</span> <span class="kd">some</span> <span class="kt">View</span> <span class="p">{</span>
<span class="kt">VStack</span> <span class="p">{</span>
<span class="err"></span><span class="kt">Image</span><span class="p">(</span><span class="nv">nsImage</span><span class="p">:</span> <span class="kt">NSImage</span><span class="p">(</span><span class="nv">named</span><span class="p">:</span> <span class="s">"gear"</span><span class="p">)</span> <span class="p">??</span> <span class="kt">NSImage</span><span class="p">())</span>
<span class="o">.</span><span class="nf">resizable</span><span class="p">()</span>
<span class="o">.</span><span class="nf">frame</span><span class="p">(</span><span class="nv">width</span><span class="p">:</span> <span class="mi">24</span><span class="p">,</span> <span class="nv">height</span><span class="p">:</span> <span class="mi">24</span><span class="p">)</span>
<span class="kt">Text</span><span class="p">(</span><span class="s">"Settings"</span><span class="p">)</span>
<span class="p">}</span>
<span class="p">}</span>
<span class="p">}</span>
</code></pre>
<pre class="highlight swift"><code><span class="kd">struct</span> <span class="kt">FaviconView</span><span class="p">:</span> <span class="kt">View</span> <span class="p">{</span>
<span class="k">let</span> <span class="nv">favicon</span><span class="p">:</span> <span class="kt">UIImage</span><span class="p">?</span>
<span class="k">var</span> <span class="nv">body</span><span class="p">:</span> <span class="kd">some</span> <span class="kt">View</span> <span class="p">{</span>
<span class="err"></span><span class="kt">Image</span><span class="p">(</span><span class="nv">uiImage</span><span class="p">:</span> <span class="n">favicon</span> <span class="p">??</span> <span class="kt">UIImage</span><span class="p">())</span>
<span class="o">.</span><span class="nf">aspectRatio</span><span class="p">(</span><span class="nv">contentMode</span><span class="p">:</span> <span class="o">.</span><span class="n">fit</span><span class="p">)</span>
<span class="o">.</span><span class="nf">frame</span><span class="p">(</span><span class="nv">width</span><span class="p">:</span> <span class="mi">16</span><span class="p">,</span> <span class="nv">height</span><span class="p">:</span> <span class="mi">16</span><span class="p">)</span>
<span class="p">}</span>
<span class="p">}</span>
</code></pre>
<pre class="highlight swift"><code><span class="kd">struct</span> <span class="kt">IconGrid</span><span class="p">:</span> <span class="kt">View</span> <span class="p">{</span>
<span class="k">var</span> <span class="nv">body</span><span class="p">:</span> <span class="kd">some</span> <span class="kt">View</span> <span class="p">{</span>
<span class="kt">HStack</span> <span class="p">{</span>
<span class="err"></span><span class="kt">Image</span><span class="p">(</span><span class="nv">uiImage</span><span class="p">:</span> <span class="n">loadedImage</span><span class="p">)</span>
<span class="o">.</span><span class="nf">resizable</span><span class="p">()</span>
<span class="err"></span><span class="kt">Image</span><span class="p">(</span><span class="nv">systemName</span><span class="p">:</span> <span class="s">"star.fill"</span><span class="p">)</span>
<span class="o">.</span><span class="nf">foregroundColor</span><span class="p">(</span><span class="o">.</span><span class="n">yellow</span><span class="p">)</span>
<span class="p">}</span><span class="o">.</span><span class="nf">accessibilityElement</span><span class="p">(</span><span class="nv">children</span><span class="p">:</span> <span class="o">.</span><span class="n">combine</span><span class="p">)</span>
<span class="p">}</span>
<span class="p">}</span>
</code></pre>
<pre class="highlight swift"><code><span class="kd">struct</span> <span class="kt">CardView</span><span class="p">:</span> <span class="kt">View</span> <span class="p">{</span>
<span class="k">var</span> <span class="nv">body</span><span class="p">:</span> <span class="kd">some</span> <span class="kt">View</span> <span class="p">{</span>
<span class="kt">VStack</span> <span class="p">{</span>
<span class="err"></span><span class="kt">Image</span><span class="p">(</span><span class="nv">uiImage</span><span class="p">:</span> <span class="n">backgroundImage</span><span class="p">)</span>
<span class="o">.</span><span class="nf">resizable</span><span class="p">()</span>
<span class="o">.</span><span class="nf">aspectRatio</span><span class="p">(</span><span class="nv">contentMode</span><span class="p">:</span> <span class="o">.</span><span class="n">fill</span><span class="p">)</span>
<span class="kt">Text</span><span class="p">(</span><span class="s">"Card Content"</span><span class="p">)</span>
<span class="p">}</span><span class="o">.</span><span class="nf">accessibilityElement</span><span class="p">(</span><span class="nv">children</span><span class="p">:</span> <span class="o">.</span><span class="n">contain</span><span class="p">)</span>
<span class="p">}</span>
<span class="p">}</span>
</code></pre>
</div>
</section>
</article>
</div>
<section class="footer">
<p>© 2023 <a class="link" href="https://jpsim.com" target="_blank" rel="external noopener">JP Simard</a> under MIT.</p>
<p>Generated by <a class="link" href="https://github.com/realm/jazzy" target="_blank" rel="external noopener">jazzy ♪♫ v0.15.3</a>, a <a class="link" href="https://realm.io" target="_blank" rel="external noopener">Realm</a> project.</p>
</section>
</body>
</html>