2017-06-02 198 views
0

任何人都知道如何更改ZK网格中的单元格的背景颜色?在网上搜索了几个小时,找不到多少。静态单元格不会成为问题,但这是一个动态呈现的网格。如何更改单个ZK网格单元格中的背景颜色?

由于我想突出显示特定的值,因此计划是将某些单元格颜色设为红色或黄色。

我祖尔:

<?page title="Ergebnis des Clusterings" contentType="text/html;charset=UTF-8"?> 
<zk xmlns:n="native" xmlns:c="client"> 
    <style>body { background-color: #fcfcfc; }</style> 
    <image id="image" src="http://i.imgur.com/dL3ahNV.gif" 
     style="display: block; width: 300px; margin: 1% auto 0 auto;"> 
    </image> 
    <window id="win" apply="org.zkoss.bind.BindComposer" 
     style="margin: 0 auto; background: #ddf4ea; position: relative;" 
     viewModel="@id('vm') @init('frontend.ClusteringOutputVM')" 
     border="normal" width="1000px" position="center,top" 
     mode="embedded"> 
     <caption label="KaufDort Cluster - Clustering Output" 
      style="font-family: Segoe UI; font-style: normal; font-size: 18px; color: #000000; padding: 5px;" /> 
     <include style="margin-top: 20px; margin-bottom: 20px;" 
      src="marketing.zul" /> 
     <hbox> 
      <grid id="grid" model="@load(vm.mapModel)" hflex="max"> 
       <columns children="@load(vm.columnsModel)"> 
        <template name="children"> 
         <column hflex="min" label="@load(each)" 
          sort="none" 
          style="background: #ddf4ea; font-family: Segoe UI; font-style: normal; font-size: 18px; color: #000000; font-weight: normal;" /> 
        </template> 
       </columns> 
       <template name="model" var="cur_row"> 
        <row 
         children="@load(vm.columnsModel) @template(forEachStatus.index lt (vm.columnsModel.size()- cur_row.value.size()) ? 'fixed' : 'variable')"> 
         <template name="fixed"> 
          <cell> 
           <button label="@load(cur_row.key)" 
            style="border: none; border-radius: 0px; background: #7f8c8d; color: white; text-shadow: none; font-size: 18px;" 
            onClick="@command('showDiagram')" width="100%" /> 
          </cell> 
         </template> 

         <template name="variable"> 
          <cell> 
           <label 
            style="text-align: left; font-family: Segoe UI; font-style: normal; font-size: 14px; color: #000000;" 
            value="@load(cur_row.value[forEachStatus.index- vm.columnsModel.size()+ cur_row.value.size()])" /> 
          </cell> 
         </template> 
        </row> 
       </template> 
      </grid> 
           
      <image id="questionmark" src="Files/QuestionmarkButton.png" 
       tooltip="centroid" style="cursor: help" /> 
         
     </hbox> 
    </window> 
    <popup id="centroid" width="300px"> 
     <html> 
      <![CDATA[ Text]]> 
     </html> 
    </popup> 
</zk> 

我的VM:

public class ClusteringOutputVM { 

    private ArrayList<KMeansCluster> clusterList; 
    private ArrayList<Feature> featureList; 
    private int numOfClusters; 
    private ListModelMap data; 
    private ListModel columns_model; 
    private boolean[][] paintMe; 
    @Wire 
    private Grid grid; 

    public ClusteringOutputVM() { 

     data = new ListModelMap(); 
     columns_model = new ListModelList(); 

     getSessionGlobalVariables(); 
     transferDataToListModelMap(); 
     fillColumnsModel(numOfClusters); 
    } 

    @AfterCompose 
    public void paintCells() { 
     for (int i = 0; i < paintMe.length; i++) { 
      for (int j = 0; j < paintMe[i].length; j++) { 
       if(paintMe[i][j]){ 
        grid.getCell(i, j); ????? 
       } 
      } 
     } 
    } 

    private void transferDataToListModelMap() { 
     List<String> valueList = new java.util.ArrayList<String>(); 
     int featureType = 0; 

     for (int i = 0; i < featureList.size(); i++) { 
      featureType = featureList.get(i).getFeatureType(); 
      if (featureType == 0) { 
       NumericFeature nf = (NumericFeature) featureList.get(i); 
       double mean = nf.getMean(); 
       double stDev = nf.getStdDev(); 

       for (int j = 0; j < clusterList.size(); j++) { 
        Instance in = clusterList.get(j).getCentroid(); 
        String centroidVal = in.toString(i); 
        double value = Double.valueOf(centroidVal); 
        if (value > (mean + stDev) || value < (mean - stDev)) { 
         paintMe[i+1][j+1] = true; 
        } 
        valueList.add(centroidVal); 

       } 
      } else { 
       for (int j = 0; j < clusterList.size(); j++) { 
        Instance in = clusterList.get(j).getCentroid(); 
        paintMe[i+1][j+1] = false; 
        valueList.add(in.toString(i)); 
       } 

       data.put((featureList.get(i).getFeatureName()), valueList); 
       valueList = new ArrayList<String>(); 
      } 
     } 

    } 

    private void getSessionGlobalVariables() { 
     clusterList = (ArrayList<KMeansCluster>) Sessions.getCurrent() 
       .getAttribute("finalClusterList"); 
     featureList = (ArrayList<Feature>) Sessions.getCurrent().getAttribute(
       "finalFeatureList"); 
     numOfClusters = (int) Sessions.getCurrent().getAttribute(
       "chosenNumOfClusters"); 
     paintMe = new boolean[featureList.size() + 1][clusterList.size() + 1]; 
    } 

    private void fillColumnsModel(int endValue) { 
     ((List) columns_model).add(new String("Feature")); 
     for (int i = 1; i <= endValue; ++i) 
      ((List) columns_model).add(new String("Cluster " + i)); 

    } 

    public ListModel getColumnsModel() { 
     return columns_model; 
    } 

    public ListModel getMapModel() { 
     return data; 
    } 

    @Command 
    public void showDiagram(
      @ContextParam(ContextType.COMPONENT) Component component) { 

     Button b = (Button) component; 
     String featureChosen = b.getLabel(); 
     Feature feat = null; 
     for (int i = 0; i < featureList.size(); i++) { 
      if (featureList.get(i).getFeatureName().equals(featureChosen)) { 
       feat = featureList.get(i); 
      } 
     } 
     Sessions.getCurrent().setAttribute("chosenFeature", feat); 

     if (feat.getFeatureType() != 0) 
      // koennte problematisch werden bei anderen Browsern 
      Executions.getCurrent().sendRedirect("stackedColumns.zul"); 
     else 
      Executions.getCurrent().sendRedirect("boxplot.zul"); 

    } 

} 
+0

什么条件需要你的细胞上色? – chillworld

回答

0

首先,

您在MVVM所以@Wire不会工作,除非接线的选择。
我具体不说如何去做,因为这是不好的做法。

刚工作MVVM:

<cell style="@load(each.condition?'some style':'some other style')"/> 

如果您不能存取权限,你总是可以使一个包装类东西包含了所有价值在分离Boolean[][]代替。

0

正如chillworld所说,@Wire在使用ViewModel时默认不起作用。请阅读here如何操作,但请注意不鼓励。

在这种情况下更好的解决方案把一些ParamObjectvalueList对于每一行,而不只是字符串:

class ParamObject { 
    private String label; 
    private String sClass; // or style 
    // getters and setters 
} 

ViewModel.transferDataToListModelMap()创建它:

Instance in = clusterList.get(j).getCentroid(); 
String centroidVal = in.toString(i); 
double value = Double.valueOf(centroidVal); 

ParamObject params = new ParamObject(); 
params.setLabel(centroidVal); 
params.setSclass(value > (mean + stDev) || value < (mean - stDev) ? "colored" : "notColored") 
valueList.add(params); 

然后可以使用数据在您的zul中绑定:

<label sclass="cur_row.value[weird index calculation].sClass" 
     style="your inline style for font" 
     value="@load(cur_row.value[weird index calculation].label)" /> 

您可能希望将索引存储在temporary field中以保持其可读性。

然后你可以为你的风格写一些sClass。如果您更喜欢使用内联样式,只需将其与您已有的字体样式连接起来,并将ParamObject的sClass/style属性与style而不是sclass绑定。

相关问题