Site updated: 2024-12-21 22:08:20

jimmy66886 · Dec 21, 2024 · aaad0eb · aaad0eb
1 parent c82ba30
commit aaad0eb
Show file tree

Hide file tree

Showing 167 changed files with 3,275 additions and 1,657 deletions.
diff --git a/404.html b/404.html
diff --git a/about/index.html b/about/index.html
diff --git a/album/index.html b/album/index.html
diff --git a/anzhiyu/random.js b/anzhiyu/random.js
diff --git a/archives/2022/09/index.html b/archives/2022/09/index.html
diff --git a/archives/2022/10/index.html b/archives/2022/10/index.html
diff --git a/archives/2022/11/index.html b/archives/2022/11/index.html
diff --git a/archives/2022/12/index.html b/archives/2022/12/index.html
diff --git a/archives/2022/index.html b/archives/2022/index.html
diff --git a/archives/2023/01/index.html b/archives/2023/01/index.html
diff --git a/archives/2023/02/index.html b/archives/2023/02/index.html
diff --git a/archives/2023/03/index.html b/archives/2023/03/index.html
diff --git a/archives/2023/04/index.html b/archives/2023/04/index.html
diff --git a/archives/2023/05/index.html b/archives/2023/05/index.html
diff --git a/archives/2023/06/index.html b/archives/2023/06/index.html
diff --git a/archives/2023/08/index.html b/archives/2023/08/index.html
diff --git a/archives/2023/09/index.html b/archives/2023/09/index.html
diff --git a/archives/2023/10/index.html b/archives/2023/10/index.html
diff --git a/archives/2023/11/index.html b/archives/2023/11/index.html
diff --git a/archives/2023/index.html b/archives/2023/index.html
diff --git a/archives/2023/page/2/index.html b/archives/2023/page/2/index.html
diff --git a/archives/2023/page/3/index.html b/archives/2023/page/3/index.html
diff --git a/archives/2023/page/4/index.html b/archives/2023/page/4/index.html
diff --git a/archives/2024/01/index.html b/archives/2024/01/index.html
diff --git a/archives/2024/02/index.html b/archives/2024/02/index.html
diff --git a/archives/2024/03/index.html b/archives/2024/03/index.html
diff --git a/archives/2024/06/index.html b/archives/2024/06/index.html
diff --git a/archives/2024/07/index.html b/archives/2024/07/index.html
diff --git a/archives/2024/11/index.html b/archives/2024/11/index.html
diff --git a/archives/2024/12/index.html b/archives/2024/12/index.html
diff --git a/archives/2024/index.html b/archives/2024/index.html
diff --git a/archives/2024/page/2/index.html b/archives/2024/page/2/index.html
diff --git a/archives/index.html b/archives/index.html
diff --git a/archives/page/2/index.html b/archives/page/2/index.html
diff --git a/archives/page/3/index.html b/archives/page/3/index.html
diff --git a/archives/page/4/index.html b/archives/page/4/index.html
diff --git a/archives/page/5/index.html b/archives/page/5/index.html
diff --git a/archives/page/6/index.html b/archives/page/6/index.html
diff --git a/categories/Hexo的使用/index.html b/categories/Hexo的使用/index.html
diff --git a/categories/JAVA/index.html b/categories/JAVA/index.html
diff --git a/categories/JAVA/page/2/index.html b/categories/JAVA/page/2/index.html
diff --git a/categories/Redis/index.html b/categories/Redis/index.html
diff --git a/categories/VsCode相关配置/index.html b/categories/VsCode相关配置/index.html
diff --git a/categories/database/index.html b/categories/database/index.html
diff --git a/categories/index copy.html b/categories/index copy.html
diff --git a/categories/index-old.html b/categories/index-old.html
diff --git a/categories/index.html b/categories/index.html
diff --git a/categories/前端/index.html b/categories/前端/index.html
diff --git a/categories/安卓/index.html b/categories/安卓/index.html
diff --git a/categories/工具/index.html b/categories/工具/index.html
diff --git a/categories/桌面/index.html b/categories/桌面/index.html
diff --git a/categories/生活/index.html b/categories/生活/index.html
diff --git a/categories/键盘/index.html b/categories/键盘/index.html
diff --git a/categories/项目/index.html b/categories/项目/index.html
diff --git a/comments/index.html b/comments/index.html
diff --git a/dailyPhoto/index.html b/dailyPhoto/index.html
diff --git a/equipment/index.html b/equipment/index.html
diff --git a/essay/index.html b/essay/index.html
diff --git a/index.html b/index.html
diff --git a/link/index.html b/link/index.html
diff --git a/maps/index.html b/maps/index.html
diff --git a/page/2/index.html b/page/2/index.html
diff --git a/page/3/index.html b/page/3/index.html
diff --git a/page/4/index.html b/page/4/index.html
diff --git a/page/5/index.html b/page/5/index.html
diff --git a/page/6/index.html b/page/6/index.html
diff --git a/photography/index.html b/photography/index.html
diff --git a/posts/108e1b72.html b/posts/108e1b72.html
diff --git a/posts/16092124.html b/posts/16092124.html
diff --git a/posts/1e320f13.html b/posts/1e320f13.html
diff --git a/posts/234602c1.html b/posts/234602c1.html
diff --git a/posts/28becffb.html b/posts/28becffb.html
diff --git a/posts/3204244d.html b/posts/3204244d.html
diff --git a/posts/41f15683.html b/posts/41f15683.html
diff --git a/posts/42b6d2a0.html b/posts/42b6d2a0.html
diff --git a/posts/43ad2276.html b/posts/43ad2276.html
diff --git a/posts/44a32457.html b/posts/44a32457.html
diff --git a/posts/4614ec31.html b/posts/4614ec31.html
diff --git a/posts/4a17b156.html b/posts/4a17b156.html
diff --git a/posts/4a3d459a.html b/posts/4a3d459a.html
diff --git a/posts/4f8e0775.html b/posts/4f8e0775.html
diff --git a/posts/4fa256c6.html b/posts/4fa256c6.html
diff --git a/posts/533f6a6.html b/posts/533f6a6.html
diff --git a/posts/54b11a0c.html b/posts/54b11a0c.html
diff --git a/posts/5a495709.html b/posts/5a495709.html
diff --git a/posts/5b6c9196.html b/posts/5b6c9196.html
diff --git a/posts/5c090a7e.html b/posts/5c090a7e.html
diff --git a/posts/6155a9d6.html b/posts/6155a9d6.html
diff --git a/posts/622a5765.html b/posts/622a5765.html
diff --git a/posts/6309c3f8.html b/posts/6309c3f8.html
diff --git a/posts/65940d5a.html b/posts/65940d5a.html
diff --git a/posts/65e770b4.html b/posts/65e770b4.html
diff --git a/posts/6daf29f8.html b/posts/6daf29f8.html
diff --git a/posts/71513ccb.html b/posts/71513ccb.html
diff --git a/posts/72387302.html b/posts/72387302.html
diff --git a/posts/73d98b28.html b/posts/73d98b28.html
diff --git a/posts/76f5b155.html b/posts/76f5b155.html
diff --git a/posts/7b3d68.html b/posts/7b3d68.html
diff --git a/posts/8407a41.html b/posts/8407a41.html
diff --git a/posts/86860c59.html b/posts/86860c59.html
diff --git a/posts/919c1073.html b/posts/919c1073.html
diff --git a/posts/92c62d.html b/posts/92c62d.html
diff --git a/posts/96a41905.html b/posts/96a41905.html
diff --git a/posts/9f786011.html b/posts/9f786011.html
diff --git a/posts/a91f5ba1.html b/posts/a91f5ba1.html
diff --git a/posts/aab9657b.html b/posts/aab9657b.html
diff --git a/posts/afea1789.html b/posts/afea1789.html
diff --git a/posts/b0e1545b.html b/posts/b0e1545b.html
diff --git a/posts/b149961.html b/posts/b149961.html
diff --git a/posts/b2233f8e.html b/posts/b2233f8e.html
diff --git a/posts/b5ac3e1f.html b/posts/b5ac3e1f.html
diff --git a/posts/b647dcf.html b/posts/b647dcf.html
diff --git a/posts/bae4ff13.html b/posts/bae4ff13.html
diff --git a/posts/bcbc907f.html b/posts/bcbc907f.html
diff --git a/posts/bdf92eba.html b/posts/bdf92eba.html
diff --git a/posts/c2ca7a91.html b/posts/c2ca7a91.html
diff --git a/posts/c5dbbdfe.html b/posts/c5dbbdfe.html
diff --git a/posts/cf408691.html b/posts/cf408691.html
diff --git a/posts/d43ca8a9.html b/posts/d43ca8a9.html
diff --git a/posts/e3b8edb4.html b/posts/e3b8edb4.html
diff --git a/posts/e56378e3.html b/posts/e56378e3.html
diff --git a/posts/ea2e7416.html b/posts/ea2e7416.html
diff --git a/posts/ed8fc0b2.html b/posts/ed8fc0b2.html
diff --git a/posts/f9ea30d.html b/posts/f9ea30d.html
diff --git a/ridePhoto/index.html b/ridePhoto/index.html
diff --git a/search.xml b/search.xml
@@ -3,6 +3,31 @@
 
 
 
+    <entry>
+      <title>Jetpack Compose</title>
+      <link href="/posts/5c090a7e.html"/>
+      <url>/posts/5c090a7e.html</url>
+
+        <content type="html"><![CDATA[<h2 id="Compose-API-设计原则"><a href="#Compose-API-设计原则" class="headerlink" title="Compose API 设计原则"></a>Compose API 设计原则</h2><p><strong>视图树一旦生成便不可随意改变，视图的刷新依靠Composable函数的反复执行来实现</strong></p><p><code>composable</code>函数只能在<code>composeable</code>函数中调用</p><p>在Compose的世界中,一切组件都是函数,由于没有类的概念,因此不会有任何继承的层次结构,<strong>所有组件都是顶层函数</strong></p><p>可以在DSL中直接调用</p><p><code>Composable</code>作为函数相互<strong>没有继承关系</strong>,有利于促使开发者使用组合的视角去思考问题</p><p>基本概念啥的都有点不太一样，和之前学的</p><h2 id="常用UI组件"><a href="#常用UI组件" class="headerlink" title="常用UI组件"></a>常用UI组件</h2><p><code>Compose</code>提供了Column,Row,Box三种布局组件,类似于传统视图中的<code>LinearLayout(Vertical)</code>,<code>LinearLayout(Horizontal)</code>,<code>RelativeLayout</code></p><h3 id="Modifier修饰符"><a href="#Modifier修饰符" class="headerlink" title="Modifier修饰符"></a>Modifier修饰符</h3><p>Modifier允许我们同诺链式调用的写法来为组件应用一系列的样式设置,如边距,字体,位移等,在Compose中,每个基础的Composable组件都有一个modifier参数,通过传入自定义的Modifier来修改组件的样式</p><ol><li>size</li></ol><blockquote><p>设置组件大小</p></blockquote><figure class="highlight kotlin"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br><span class="line">9</span><br><span class="line">10</span><br><span class="line">11</span><br><span class="line">12</span><br><span class="line">13</span><br><span class="line">14</span><br></pre></td><td class="code"><pre><span class="line">Image(</span><br><span class="line">    painterResource(id = R.drawable.shiguang2),</span><br><span class="line">    contentDescription = <span class="literal">null</span>,</span><br><span class="line">    modifier = Modifier</span><br><span class="line">        .size(<span class="number">100.</span>dp) <span class="comment">// width与height同时设置为100dp</span></span><br><span class="line">        .clip(CircleShape) <span class="comment">// 将图片裁切为圆形</span></span><br><span class="line">)</span><br><span class="line"><span class="comment">// size也可以分开设置宽和高</span></span><br><span class="line">Image(</span><br><span class="line">    painterResource(id = R.drawable.shiguang2),</span><br><span class="line">    contentDescription = <span class="literal">null</span>,</span><br><span class="line">    modifier = Modifier</span><br><span class="line">        .size(width = <span class="number">200.</span>dp, height = <span class="number">500.</span>dp) <span class="comment">// 分别指定宽和高</span></span><br><span class="line">)</span><br></pre></td></tr></table></figure><ol start="2"><li>background</li></ol><blockquote><p>用来为修饰组件添加背景色,背景色支持设置color的纯色背景也可以使用brush设置渐变色背景,Brush是Compose提供的用来创建线性渐变色的工具</p></blockquote><figure class="highlight kotlin"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br><span class="line">9</span><br><span class="line">10</span><br><span class="line">11</span><br><span class="line">12</span><br><span class="line">13</span><br><span class="line">14</span><br><span class="line">15</span><br><span class="line">16</span><br><span class="line">17</span><br><span class="line">18</span><br><span class="line">19</span><br><span class="line">20</span><br><span class="line">21</span><br><span class="line">22</span><br><span class="line">23</span><br><span class="line">24</span><br><span class="line">25</span><br><span class="line">26</span><br></pre></td><td class="code"><pre><span class="line">    Row &#123;</span><br><span class="line">        Box(</span><br><span class="line">            Modifier</span><br><span class="line">                .size(<span class="number">50.</span>dp)</span><br><span class="line">                .background(color = Color.Red) <span class="comment">// 设置纯色背景</span></span><br><span class="line">        ) &#123;</span><br><span class="line">            Text(<span class="string">&quot;纯色&quot;</span>, Modifier.align(Alignment.Center))</span><br><span class="line">        &#125;</span><br><span class="line">        Spacer(modifier = Modifier.width(<span class="number">16.</span>dp))</span><br><span class="line">        Box(</span><br><span class="line">            Modifier</span><br><span class="line">                .size(<span class="number">50.</span>dp)</span><br><span class="line">                .background(brush = verticalGradientBrush)</span><br><span class="line">        ) &#123;</span><br><span class="line">            Text(<span class="string">&quot;渐变色&quot;</span>, Modifier.align(Alignment.Center))</span><br><span class="line">        &#125;</span><br><span class="line">    &#125;</span><br><span class="line"></span><br><span class="line"><span class="comment">// 创建Brush渐变色-放在Composable方法的外面</span></span><br><span class="line"><span class="keyword">val</span> verticalGradientBrush = Brush.verticalGradient(</span><br><span class="line">    colors = listOf(</span><br><span class="line">        Color.Red,</span><br><span class="line">        Color.Yellow,</span><br><span class="line">        Color.Green</span><br><span class="line">    )</span><br><span class="line">)</span><br></pre></td></tr></table></figure><p><strong>传统视图中的View的background属性可以用来设置图片格式的背景，但是这里是不支持的，Compose的background只能设置颜色背景</strong></p><ol start="3"><li>fillMaxSize</li></ol><blockquote><p>size可以控制组件的大小，而<code>fillMaxSize</code>可以让组件在高度或者宽度上填满父空间，此时可以用<code>fillMaxSize</code></p></blockquote><figure class="highlight kotlin"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br><span class="line">9</span><br><span class="line">10</span><br><span class="line">11</span><br><span class="line">12</span><br><span class="line">13</span><br></pre></td><td class="code"><pre><span class="line">Row(</span><br><span class="line">    Modifier.background(Color.Yellow).width(<span class="number">100.</span>dp).height(<span class="number">200.</span>dp)</span><br><span class="line">) &#123;</span><br><span class="line">    <span class="comment">/*Box(</span></span><br><span class="line"><span class="comment">        Modifier.fillMaxSize().background(Color.Red)</span></span><br><span class="line"><span class="comment">    )*/</span></span><br><span class="line">    <span class="comment">/*Box(</span></span><br><span class="line"><span class="comment">        Modifier.fillMaxHeight().width(60.dp).background(Color.Green) // 填满高度，宽度自定义</span></span><br><span class="line"><span class="comment">    )*/</span></span><br><span class="line">    Box(</span><br><span class="line">        Modifier.fillMaxWidth().height(<span class="number">50.</span>dp).background(Color.Blue)  <span class="comment">// 填满宽度，高度自定义</span></span><br><span class="line">    )</span><br><span class="line">&#125;</span><br></pre></td></tr></table></figure><ol start="4"><li>border&amp;padding</li></ol><blockquote><p>border用来为被修饰组件添加边框，边框可以指定颜色，粗细，以及通过Shape指定形状，比如圆角矩形等，padding用来为被修饰组件增加间隙，可以在border前后各插入一个padding，区分对外和对内的比间距</p></blockquote><figure class="highlight kotlin"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br><span class="line">9</span><br><span class="line">10</span><br><span class="line">11</span><br><span class="line">12</span><br></pre></td><td class="code"><pre><span class="line">Box(</span><br><span class="line">    modifier = Modifier</span><br><span class="line">        .padding(<span class="number">8.</span>dp) <span class="comment">// 外间隙</span></span><br><span class="line">        .border(<span class="number">2.</span>dp, Color.Red, shape = RoundedCornerShape(<span class="number">2.</span>dp)) <span class="comment">// 边框</span></span><br><span class="line">        .padding(<span class="number">8.</span>dp)</span><br><span class="line">)&#123;</span><br><span class="line">    Spacer(</span><br><span class="line">        Modifier</span><br><span class="line">            .size(width = <span class="number">100.</span>dp, height = <span class="number">10.</span>dp)</span><br><span class="line">            .background(Color.Red)</span><br><span class="line">    )</span><br><span class="line">&#125;</span><br></pre></td></tr></table></figure><p><img src="https://img01.zzmr.buzz/img/20241221213559.png" alt="20241221213559"></p><p>相对于传统布局有Margin和Padding之分，Compose中只有padding这一种修饰符，根据在调用链的位置不同发挥不同的作用，概念更加简洁</p><ol start="5"><li>offset</li></ol><blockquote><p>offset修饰符用来移动被修饰组件的位置,我们在使用时只分别传入水平方向与垂直方向的偏移量</p></blockquote><p><strong>Modifier调用顺序会影响最终UI呈现的效果,这里应使用offset修饰符偏移,再使用background修饰符绘制背景色</strong></p>]]></content>
+
+
+      <categories>
+
+          <category> 安卓 </category>
+
+      </categories>
+
+
+        <tags>
+
+            <tag> kotlin </tag>
+
+        </tags>
+
+    </entry>
+
+
+
     <entry>
       <title>1</title>
       <link href="/posts/aab9657b.html"/>