css - 在 managedBean 中从 GUI 更改 .css 文件

Question

我制作了一个带有颜色选择器的 jsf 页面，管理员可以在其中更改由 4 种颜色组成的网站主题。我在我的 css 中用数字作为我的主要颜色的前缀:

.element{
    background: /*1*/#333333;
}

因此，为了获得颜色，我只是遍历所有 css 文件并找到该数字(从 1 到 4)之后的颜色。获得这些效果很好，但是当我尝试设置颜色并刷新页面时，我根本没有 css。但是，当我清理元素时，.css 会以原始颜色备份。

我的代码有点古怪，但这里是:

@ManagedBean
public class SiteColorsSettings {
    private String color1, color2, color3, color4;
    private final String CSS_FOLDER_PATH = "/resources/css";
    ServletContext ctx;
    String realPath;

    public SiteColorsSettings() {
        ctx = (ServletContext) FacesContext.getCurrentInstance()
                .getExternalContext().getContext();
        realPath = ctx.getRealPath("/");
        getColors();
    }

    public void getColors() {
        try {
            File cssFolder = new File(realPath + CSS_FOLDER_PATH);
            if (!cssFolder.exists()) {
                System.out.println("css folder not found");
            }
            File[] listOfFiles = cssFolder.listFiles();

            for (int i = 0; i < listOfFiles.length; i++) {
                if (listOfFiles[i].isFile()) {
                    String currentLine;
                    BufferedReader br = new BufferedReader(new FileReader(
                            listOfFiles[i]));

                    while ((currentLine = br.readLine()) != null) {
                        if (currentLine.contains("/*1*/")) {
                            this.color1 = currentLine.substring(currentLine
                                    .lastIndexOf("/*1*/") + 6);
                        }
                        if (currentLine.contains("/*2*/")) {
                            this.color2 = currentLine.substring(currentLine
                                    .lastIndexOf("/*2*/") + 6);
                        }
                        if (currentLine.contains("/*3*/")) {
                            this.color3 = currentLine.substring(currentLine
                                    .lastIndexOf("/*3*/") + 6);
                        }
                        if (currentLine.contains("/*4*/")) {
                            this.color4 = currentLine.substring(currentLine
                                    .lastIndexOf("/*4*/") + 6);
                        }
                    }
                }
            }

        } catch (Exception e) {
            System.out.println(e.getMessage());
        }
    }

    public void setColors() {
        try {
            File cssFolder = new File(realPath + CSS_FOLDER_PATH);
            if (!cssFolder.exists()) {
                System.out.println("css folder not found");
            }
            File[] listOfFiles = cssFolder.listFiles();

            switchColors(listOfFiles);

        } catch (Exception e) {
            System.out.println(e.getMessage());
        }
    }

    private void switchColors(File[] files) {
        for (int i = 0; i < files.length; i++) {
            try {
                if (files[i].isFile()) {
                    BufferedReader br = new BufferedReader(new FileReader(
                            files[i]));
                    String fileContent = "";
                    String currentLine;
                    while ((currentLine = br.readLine()) != null) {
                        fileContent += currentLine;
                    }
                    for (int j = 1; j <= 4; j++) {
                        if (fileContent.contains("/*" + j + "*/")) {
                            int endOfColorChar = fileContent
                                    .lastIndexOf("/*+j+*/") + 12;
                            String fColor = fileContent.substring(
                                    fileContent.lastIndexOf("/*+j+*/") + 6,
                                    endOfColorChar);
                            switch (j) {
                            case (1):
                                fileContent.replace("/*j*/" + fColor, "/*j*/"
                                        + this.color1);
                                break;
                            case (2):
                                fileContent.replace("/*j*/" + fColor, "/*j*/"
                                        + this.color2);
                                break;
                            case (3):
                                fileContent.replace("/*j*/" + fColor, "/*j*/"
                                        + this.color3);
                                break;
                            case (4):
                                fileContent.replace("/*j*/" + fColor, "/*j*/"
                                        + this.color4);
                                break;
                            }
                            FileWriter fw = new FileWriter(files[i]);
                            BufferedWriter bw = new BufferedWriter(fw);
                            bw.write(fileContent);

                        }
                    }
                }

            } catch (Exception e) {
                e.printStackTrace();
            }
        }

    }

那么发生了什么？我是否在元素保持不变的情况下更改已部署的文件？如果是这样，为什么刷新后我的页面上没有 css？我检查了字符串 fileContent 并且 css 在那里...

Answer 1

我不建议在运行时更改文件内容。您可以使用不同的方法来解决您的问题。

1. 在您的 .css 中使用表达式语言，比如:

   .element{
       background: ##{siteColorsSettings.color1};
   }
   

   请注意，这仅在 referenced via <h:outputStylesheet> 时有效而不是通过 <link> .

2. 将 getter 和 setter 添加到托管 bean 中的颜色值。

3. 将您的颜色值保存在数据库或配置(例如 colors.properties)文件中，内容如下:

   color1=333333
   color2=777777
   ...
   

   并使用 Properties 访问/更改它们类。