fqsz/pages/theme/theme.wxml

<view class="theme-container" style="background-color: {{themes[currentTheme].bgColor}}; color: {{themes[currentTheme].textColor}};">
  <view class="theme-header">
    <view class="theme-title">主题设置</view>
    <view class="theme-desc">自定义你的应用外观</view>
  </view>

  <view class="theme-section">
    <view class="section-title">主题风格</view>
    <view class="theme-options">
      <view 
        wx:for="{{themes}}" 
        wx:key="name" 
        class="theme-option {{currentTheme == index ? 'active' : ''}}"
        data-index="{{index}}"
        bindtap="switchTheme">
        <view class="theme-preview" style="background-color: {{item.bgColor}}; color: {{item.textColor}}">
          <view class="preview-title">{{item.name}}</view>
        </view>
        <view class="theme-check {{currentTheme == index ? 'checked' : ''}}">
          <image src="/images/check1.png" wx:if="{{currentTheme == index && themes[currentTheme].textColor === '#333'}}"></image>
          <image src="/images/check-white.png" wx:if="{{currentTheme == index && themes[currentTheme].textColor !== '#333'}}"></image>
        </view>
      </view>
    </view>
  </view>

  <view class="theme-section">
    <view class="section-title">主色调</view>
    <view class="color-options">
      <view 
        wx:for="{{colorOptions}}" 
        wx:key="*this" 
        class="color-option"
        data-color="{{item}}"
        style="background-color: {{item}}"
        bindtap="setPrimaryColor">
        <view class="color-check {{primaryColor == item ? 'checked' : ''}}">
          <image src="/images/check-white.png" wx:if="{{primaryColor == item}}"></image>
        </view>
      </view>
    </view>
  </view>

  <view class="apply-btn" style="background-color: {{primaryColor}}" bindtap="applyTheme">
    应用主题
  </view>
</view>