123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384 |
- const app = getApp();
- Page({
- data: {
- currentTheme: 0,
- primaryColor: '#E7624F',
- themes: [
- { name: '默认主题', bgColor: '#f8f8f8', textColor: '#333' },
- { name: '深色主题', bgColor: '#333', textColor: '#f5f5f5' },
- { name: '护眼主题', bgColor: '#e6f7ed', textColor: '#333' }
- ],
- colorOptions: [
- '#E7624F', '#4285F4', '#34A853', '#FBBC05', '#EA4335', '#9C27B0'
- ],
- theme: {}
- },
- onLoad: function () {
- const savedTheme = wx.getStorageSync('theme') || app.globalData.theme;
- const currentTheme = savedTheme.currentTheme || 0;
- const primaryColor = savedTheme.primaryColor || '#E7624F';
-
- this.setData({
- currentTheme,
- primaryColor,
- theme: savedTheme
- });
- this.updateNavigationBarColor();
- if (app.eventBus) {
- app.eventBus.on('themeChange', (theme) => {
- this.setData({ theme });
- this.updateNavigationBarColor();
- });
- }
- },
- switchTheme: function(e) {
- this.setData({
- currentTheme: e.currentTarget.dataset.index
- });
- },
- setPrimaryColor: function(e) {
- this.setData({
- primaryColor: e.currentTarget.dataset.color
- });
- this.updateNavigationBarColor();
- },
- applyTheme: function() {
- const { currentTheme, primaryColor, themes } = this.data;
- const newTheme = {
- ...themes[currentTheme],
- primaryColor,
- currentTheme
- };
- wx.setStorageSync('theme', newTheme);
- app.globalData.theme = newTheme;
- if (app.eventBus) {
- app.eventBus.emit('themeChange', newTheme);
- }
- wx.showToast({
- title: '主题应用成功',
- icon: 'success'
- });
-
- setTimeout(() => wx.navigateBack(), 1500);
- },
- // 新增:更新导航栏颜色的方法
- updateNavigationBarColor: function() {
- const { theme, primaryColor } = this.data;
- const textColor = theme.textColor || '#333';
- wx.setNavigationBarColor({
- frontColor: textColor === '#333' ? '#000000' : '#ffffff',
- backgroundColor: primaryColor
- });
- }
- });
|