鸿蒙开发：通过代码方式实现跟随系统深浅模式动态切换原创

如我们继续上上一个视频讲啊，上一个视频我们实现了使用资源的方式，然后动态的去切换了我们的一个呃模式，那么这个，那么这个视频呢，我们主要是采用啊代码的方式啊，我们实现一个跟随系统模式切换而切换的一个功能，OK, 那么我们把之前的代码啊就可以进行先把它呃删除掉，因为毕竟这是第一种的实现方式，我们把这个卡入的。给它删除掉。那么同样呢，我们在我们资源里面，我们就可以把这个账号给它删除掉。OK呢，在这个贝斯里面呢，其实我们这个颜色呢，其实呃默认的颜色，当然我们也可以呃保持住啊，因为我们都需要，都是基本上在开发中也都是根据资源里面的颜色呃动态去获取的，那么这里呢，呃，当然你可以删，你可以呃直接去获取的，OK, 这里呢，我们为了便于演示，我们也把它删删除掉吧，OK.

好，我们基本上代码已经还原了，那么我们怎么样通过代码方式来实现我们的一个模式的一个动态切换呢？在上个视频呢，在在上个视频中，其实我们已经讲到了。那么你怎么去通过代码的方式，哎去实现我们这个模式切换的很简单，你必须要怎么着知道哎系统哎是否触发了一个模式的变化，对吧？也就是说在这个设置里面对吧？当你点击哎深层模式或者浅测模式的时候啊，我们得需要监听到你这个动作对吧？监听到动作之后，我们就可以根据啊，你深色模式啊或者浅色模式呢，去动态设置我们的一个颜色啊或者是图片。嗯，这个是很简单啊，其实在那个ability里面呢，其实啊，都给我们提供了我们啊。监听到的那个模式的一个切换，OK, 嗯，首先呢，呃，我们可以在初始化时，初始化的时候通过connects一个上下文拿到我们的一个模式，也就是说当当你的应用，嗯，当你的应用对吧，哎之后对吧，它是深色模式呢，我们就设置成深色模式，浅色模式呢，我们就设置浅色模式。

我们都可以通过这个上下文，哎，我们可以拿到一个con con里面有一个什么看的model，那么这个color的model呢里面，哎，就有我们所需要的。深色模式。对吧，为0对吧，前四模式是为啊1OK，那么拿到这个模式之后呢，我们怎么样在UI界面对吧，监听到你这个模式呢。当然很简单，我有很多种的实现方式，比如说你用用存储也好，你是用那个全球并量也好，对吧，你是用那个广播对吧，发送也好，都是可以的，那么这里呢，哎，我们简单使用这个AB给，然后我们去存储哎，我们的一个呃模式，然后在呃UI页面呢，我们去再去获取到我们成统的模式，OK.

首先是初始化。你们通过a three.面有一个什么，嗯塞哦。可对吧，是也可以可以就是我们一看了目。啊，我们的。哎，模式进行。存储线OK，这是我们初始化进来的，进来的模式，对吧，我们拿到了对吧，在UI界面我们也可以进行拿到，但是呢，你不仅仅是初始化进来呀，对吧，你这个设置里面，哎，去点击切换的时候。对吧，回到我们这个应用里面，我们也是需要去知道的。那么怎么样去监测到它切换的一个状态呢？哎，我们可以通过哎这个OB里面有一个叫on conviction.

AB通过这个方法，哎，我们就可以。拿到我们的一个啊模式，后来呢，你有卡贝课里面，我们有一个卡拉摩的对吧，我们可以先去听一下看一看啊。OK, 我们去运营一下。看看这个模式在切换的时候，哎，它有没有发生改变。看对吧，浅色模式已经打印出来是0，我们切换成深色模式。来，我们切换成。啊。哦，刚才是深色模式，我们切换成浅色模式。哎，发现它是唯一，我们再切换成生存模式。

对吧，它是为零，OK, 那么基本上我们这个模式状态我们已经拿到了啊，同样的我们怎么呢，要更新一下我们的一个模式啊，这个说这些。好，模式的初始化以及动态监听啊，我们都已经拿到了，我们回过来UI里面怎么着，我们要去监听到刚才。监听到刚才我们去存储的一个啊P课模式这里呢，我们使用什么。那个。9。@。Studio problem.OK, 我们鉴定是哪个呢？就是我们的一个刚才设置好的一个什么叫卡文。通过我们的一个呃，At watch观察它是否发生了一个啊。

变化的，那么这里呢，我们。给他写一个方法啊，叫做。嗯，Color color么不。我们的一个，呃，当前的一个模式。它的模式是一个，那么。啊，嗯，当然了，我们这里也可以给他一个默认的，也可以给他一个什么啊。嗯，一个是非默认的，当然这里面我们可以给他一个是默认的。还有一个是卡贝克学啊，Stand里面有一个卡model，第二还有我们给他一个，呃，默认的就是浅色模式。OK, 那么我们要去实现，我们有一个观察的方法了。好在这个观察的一个，呃，方法里面呢，是不是我们要去监听到，哎，我们的一个是current model是否发生了一个变化，对吧，如果。

如果你是，哎，浅色模式。我要设置什么颜色。对吧，否则哎，你是。深色模式。OK, 这样两个模式呢，啊，我们都已经，哎。都已经呃设置好了，当然了，在咱们初始化的时候呢，对吧，初始化的时候我们也需要怎么着去获取一下我们当前的一个模式，对吧，这里我们在那个to里面一言去。

调一下我们刚才的一个。看了摩托拆展，OK, 那么浅色模式下，哎，我们设置什么颜色，在深色模式下，哎，我们设置啊什么颜色啊，这里的话咱们就快速的去，呃，是动态的去创建几个属性，对吧？State你的I都卡。大家都看了，当然这里我们嗯。The south Korea.啊。显色模式下呢，啊，我们当然这里呢，我们可以给它设置一个默认值，当然也可以不设置啊，都是可以的，我们这里就不设置了。不设置的话，那么它就删掉了。好，这是我们的标题的颜色，同样的还有我们的一个什么描述的颜色的。还有一个什么，我们的一个背景。OK, 我们把我这三个属性，呃，给我们对应的组件设置上，首先呢，它是一个外根温档。

卡了。类似这样，哎，别记他了。那么同样的。标题。他是。拍的看了。描述。它是比。T, 看了OK，好三个属性设置完之后呢，啊，我们还要根据某不同的不同的模式去设置不同的颜色，首先浅色模式下它是一个什么。浅色模式呀，它是一个。嗯。浅色模式一下这个标题它是什么黑色的对吧，我们给它一个二进制吧，12346。同样的，我们的。描述。你。它是一个浅灰色。还有我们的一个背景，那背景呢，浅色模式肯定是白色的，对不对。Ad卡了，等一下。12346。

同样的，呃，我们的深色模式呢？也得给它标记出来，嗯，标题呢，它是白色。这个稍微一个浅白色。嗯，背景呢是黑色。OK, 来，我们。去简单去运行一下，看一下效果。嗯，OK, 我们先去把它，把这个默认模式切，切换成一个浅色模式，OK, 回过来。然后我们发现什么，发现出来我们的一个怎么是背景发生变化了，哦，原来是我们的这个是颜色是我们自己的问题啊，这个是一个放的卡了，我说呢，怎么看着这么奇怪，来咱们去运用一下。

哎，现在基本上就没问题了，来我们把它设置成一个深色模式。哎，我们可以发现，哎，我们的背景发生了变化，我们的呃，标题和描述呢也发生了变化，哎，我们再切换成浅色模式。嗯，前的模式正好也还原了。这是非常。非常好的，OK, 但是呢，我们发现一个问题对吧，当你申诉模式切换之后，发现你的状态栏和你的导航栏并没有跟着去切换。那么这种处理方式呢，有两种，第一种呢，就是我们采用全局的一个沉浸式，那么沉浸式之后呢，那我们呢，呃，我们呢，就会呃，占领那个非安全区，对吧，然后我们就可以把这个布局顶上去，或者说顶下去。啊，这种情况是没问题，第二种呢，就是我们呃避开安全区，那么就可以呃实现我们的效果啊，我们避开安全区。

咱们它有一个属性叫一个pen。Expand有一个S。哦，里面有两个属性，第一个属性是我们。两个属性都是数组啊。那么第一个，首先我们可以根据这个系统的一个。嗯。有一个3MAP里面有一个C缝那样的，我们要避开嘴部和。底部对吧。I'm there?嗯，不是吧，反正应该是AA这个。还有一个是。不OK，我们再去运行一下。OK, 这样这种情况呢，我们就没有问题了，哎，我们再去切换一下。

切换成爱我们的一个深色模式。OK.呃，浅色模式目前已经切换了潜伏模式了，我们再切换成一个深色模式。OK, 这种情况下呢，呃，我们就啊随着系统的颜色的一个改变而改变，那么同样的这种情况下是需要通过代码的实现方式我们去监听，哎，你系统哪个模式发生了改变，然后呢，呃，在代码里面通过你模式的改变，然后我们去设置，当然这里面还有一个问题啊，就是说说我们那些状态栏，我们状态栏的。对吧。文字的颜色，那么你深色模式肯定要把它展示出来，对吧，你看那我们设置浅色模式的时候。对吧，然后去深色模式。你肯定要设置成我们的一个什么啊状态栏对吧，那么状态栏怎么去设置呢？很简单对吧，它可以通过你的温度。

Window里面有一个get last window对吧，传入你的一个上下文，然后呢，就拿到你的一个。第一个是L，这个我们不用了，懂的，最主要是第二个window，通过通过这个window，哎，我们是不是就可以去设置我们的啊，我们的那个顶部的导航栏的一个一个颜色，我记得叫一个什么set，对set Windows的灯框。通过它，然后我们就可以去设置，比如说我们的一个导航栏应该是嗯。X, 什么啊，对，Stayed back卡对吧，它有一个ST。对对吧，Stay color, 还有star contain color, 还有一个你的呃颜色的一个配置。

那这里的话，我们可以根据你是否，你是否，比如说哎，你是。你是浅色模式，浅色模式呢，我就。等于一个force。以深色。我是哪个我就等于各处。哎，咱们再去看一下效果。来我们，嗯，再切换一下。切换成深色模式。嗯，我们发现这个颜色并没有发生。并没有发生变化对吧，那没有发生变化的话，我们是不是还得一个呃，System bar.Huh he's navigation system bar.哦。肯定能看得到。我们试试这个。

嗯，首先它是如果是白色，我们给他一个黑色。Cardia black.如果是深色呢，我们给他一个白色。Color.Come there.我们再去改。稍等啊。哦，它是一个呃，String, 那么string的话我们就适用禁止了。123456。S.啊，1234566个LOK，我们再去续一下。啊，应该我记得是没错的，就是通过这个温度来设置的啊，哎，看看我们现在已经显示出来的吧，这个你的时间还有你的那个呃，充电的一个利用对吧，来我们设置一个。白色。对吧，浅色背景。

哎，浅色背景也能正常显示对吧，黑色，哎，我们再去设置一下黑色。嗯，也变成一个白色，其实我们好像嗯。通过这两个属性我们就可以实现了，OK, 那么这就是我们一个，呃，通过代码的形式，然后去动态去改变，根据那个系统的深色或者浅色动态改变我们应用的一个深色和浅色，OK, 那咱们这个视频先到这里，OK, 谢谢大家。