Customization, ioda.style file

A lot can be customized by editing and installing a ioda.style file in the document directory. See the files section about the document directory and how to send a file on a device in thie directory.

The default user interface has black texts on orange backgrounds (!). But a ioda.style file is present in the "resource directory" of the application in order to have a similar look and feel as the Apple "black on white" style found for example on the iPad Settings panels. But having a ioda.style file in the document directory can override the content of the one in the resource directory. To have an idea of how a ioda.style looks, you can download the default ioda.style used by the application from the download area. The default ioda.style is also fully listed at The default ioda.style.

The ioda.style file is at the XML format and contains named :

     <style>

components having a set of elements of the form :

     <key>value</key>

For example :

     <style name="scene">
        <screen_color>white</screen_color>
     </style>

permits to set to white the background screen color when visualizing something.

Customization of the user interface

An important style component is the "gui" one that permits to customize the user interface buttons and panels. Keys for the buttons are :

     <screen_color>
     <back_color>
     <front_color>
     <border_color>
     <arm_color>

Keys to customize the warning dialog are :

     <warn_back_color>
     <warn_front_color>
     <warn_border_color>

And keys to customize the help text areas are :

     <text_back_color>
     <text_front_color>
     <text_border_color>

Customization of the plots

An other import component is the

     <plotter_style>

one that permits to fully customize plots.

The named plotter_style contains named style for the various parts of the scene constituing a plot. The names of the scene part styles are today :

    bins_style.[0,[
    errors.[0,[      
    points.[0,[
    func.[0,[
    grid
    inner_frame
    infos
    title
    x_axis.[line,ticks,labels,mag,title]
    y_axis.[line,ticks,labels,mag,title]
    z_axis.[line,ticks,labels,mag,title]

The scene part styles can have keys :

    visible : bool (default is true).
    color : color3f (black)
    transparency : float (0)
    line_width : float (1)
    line_pattern : enum (line_solid)
    marker_size : float (1)
    font : string (hershey)
    front_face : [winding_ccw,winding_cw] (winding_ccw)
    encoding : string (none).
    modeling : string (boxes).

The modeling value depends of what is plotted. The "plottables" are classified according :

    bins1D : to visualize an histogram 1D.
    bins2D : for an histogram 2D.
    func1D : for a 1D function (having one "x" argument).
    func2D : for a 2D function (having two x,y arguments).
    points2D : for a cloud of 2D points.
    points3D : for a cloud of 3D points.

Plottables could be represented in a "xy" layout or in a "xyz" 3D layout. For example a bins2D can be visualized as a "lego" in a xyz plotter layout or as "boxes" in a xy plotter layout. So a modeling value depends of the kind of the plottable and of the kind of the plotter layout. Today possibilities are :

    bins1D_xy : boxes, top_lines, points.
    errors1D_xy : I, plus.
    bins2D_xy : boxes.
    points2D_xy : lines, points.

The plotting_style can have also a list of keys of its own. These keys are today :

    [width,height,depth] : floats (1) : size
      of the plot in world coordinate (WC).
    [left,right,top,bottom,down,up]_margin :
      floats (0.1) : world coordinate margins
      for the data area relative to the plotter size.
    title : string ("").
    title_up : bool (true) : title on top or
      below the data area.
    title_to_axis : float (0.06) : axis distance
      to the data area.
    title_height : float (0.014) : self explanatory.
    title_automated : bool (true) : if true the
      plotter guesses a name from the data.
      In general it is the title of the first
      plotted data.
    title_hjust : [left,center,right] (center) :
      justification of the title relative to
      the data area x extend.
    [x,y,z]_axis_automated : bool (true) :
      if true, the plotter guesses axis min/max
      from the data.
    [x,y,z]_axis_min : float (0) : axis min value
      in case axis_automated is false.
    [x,y,z]_axis_max : float (1_ : axis max value
      in case axis_automated is false.
    [x,y,z]_axis_is_log : bool (false) : if true,
      the ticks are log scaled.
    value_top_margin : float (0.1) :
      distance, in percent of data area height,
      to top data area of any data representation.
    infos_[x,y]_margin : float (0) :
      in the info box margin, in percent of the
      box width, of the inside text relative
      to borders.
    infos_what : string : to tell what to show
      in the infos box. It is a list of space
      separated keys. Default value is :
        name entries mean rms fit_quality fit_ndf
        fit_parameters fit_errors
    legends_visible : bool (false) : show or not the
      legend boxes.

For example the default ioda.style found on the download area contains the "default" plotting_style which is applied on all plots. The head of the default plotting_style is :

    <plotter_style name="default">
      <style name="bins_style.0">
        <modeling>top_lines</modeling>
        <color>black</color>
        <marker_size>5</marker_size> <!-- for profile -->
      </style>
      ...
    </plotter_style>

which tell that the first histogram plotted (index 0) will have its bins modeled with black "top lines". In case the histogram is a profile, bins are modeled with 5 pixels points.

The default ioda.style

<styles>

  <!-- //////////////////////////////////////////////// -->
  <!-- /// user interface : /////////////////////////// -->
  <!-- //////////////////////////////////////////////// -->
  <alias name="gui">gui_Apple_black_on_white</alias>
<!--
  <alias name="gui">gui_Apple_white_on_black</alias>
-->

  <!-- FIXME : Mac-standard font is : Lucida Grande.
       Could be fine to have the same. -->

  <style name="gui_Apple_black_on_white">
    <screen_color>0.9 0.9 0.9</screen_color>
    <back_color>white</back_color>
    <front_color>black</front_color>
    <dir_color>0.95 0.95 0.95</dir_color>
    <border_color>black</border_color>
    <arm_color>0.6 0.8 1</arm_color>
    <warn_back_color>salmon</warn_back_color>
    <warn_ok_color>palegreen</warn_ok_color> <!-- not Apple. -->
    <warn_front_color>black</warn_front_color>
    <warn_border_color>black</warn_border_color>
    <!-- for help -->
    <text_back_color>white</text_back_color>
    <text_front_color>black</text_front_color>
    <text_border_color>black</text_border_color>
  </style>

  <style name="gui_Apple_white_on_black">
    <screen_color>sienna</screen_color>
    <back_color>black</back_color>
    <dir_color>0.1 0.1 0.1</dir_color>
    <front_color>white</front_color>
    <border_color>grey</border_color>
    <arm_color>orange</arm_color>
    <warn_back_color>salmon</warn_back_color>
    <warn_ok_color>palegreen</warn_ok_color> <!-- not Apple. -->
    <warn_front_color>white</warn_front_color>
    <warn_border_color>white</warn_border_color>
    <!-- for help -->
    <text_back_color>white</text_back_color>
    <text_front_color>black</text_front_color>
    <text_border_color>black</text_border_color>
  </style>

  <!-- //////////////////////////////////////////////// -->
  <!-- /// scene : //////////////////////////////////// -->
  <!-- //////////////////////////////////////////////// -->
  <style name="scene">
    <screen_color>white</screen_color>
  </style>

  <!-- //////////////////////////////////////////////// -->
  <!-- /// plotter : ////////////////////////////////// -->
  <!-- //////////////////////////////////////////////// -->
  <plotter_style name="default">
    <!-- It is applied on all plotters.
         It is a placeholder for default customization. -->
    <style name="background_style"/>
    <style name="title_style"/>
    <style name="infos_style"/>
    <style name="title_box_style"/>
    <style name="inner_frame_style"/>
    <style name="grid_style"/>
  
    <style name="x_axis.line_style"/>
    <style name="x_axis.ticks_style"/>
    <style name="x_axis.labels_style"/>
    <style name="x_axis.mag_style"/>
    <style name="x_axis.title_style"/>
  
    <style name="y_axis.line_style"/>
    <style name="y_axis.ticks_style"/>
    <style name="y_axis.labels_style"/>
    <style name="y_axis.mag_style"/>
    <style name="y_axis.title_style"/>
  
    <style name="z_axis.line_style"/>
    <style name="z_axis.ticks_style"/>
    <style name="z_axis.labels_style"/>
    <style name="z_axis.mag_style"/>
    <style name="z_axis.title_style"/>

    <style name="bins_style.0"/>
    <style name="errors_style.0"/>
    <style name="points_style.0"/>
    <style name="func_style.0"/>
  </plotter_style>

  <plotter_style name="ROOT_default">
    <value_top_margin>0.05</value_top_margin>
    <bottom_margin>0.1</bottom_margin>
    <top_margin>0.1</top_margin>
    <left_margin>0.1</left_margin>
    <right_margin>0.1</right_margin>

    <style name="background_style">
      <visible>true</visible>
      <back_color>ROOT/grey19</back_color>
      <!-- border : -->
      <color>black</color>
      <line_width>0.003</line_width> <!-- 0 = no border. In % of width -->
    </style>

<!-- <style name="wall_style"><visible>false</visible></style> -->
    <style name="grid_style">
      <visible>false</visible>
<!--  <color>white</color> ???? --> 
    </style>

    <!-- plot title done with the title_box (and not plotter title). -->
    <style name="title_style">
      <visible>false</visible>
    </style>
    <style name="title_box_style">
      <visible>true</visible>
      <back_color>ROOT/grey19</back_color>
      <back_shadow>0.015</back_shadow> <!-- % of width -->
      <color>black</color>
      <font>arialbd.ttf</font>
      <front_face>cw</front_face>
      <smoothing>true</smoothing>
    </style>

    <infos_width>0.2</infos_width>
    <infos_x_margin>0.01</infos_x_margin> <!-- from right border. -->
    <infos_y_margin>0.005</infos_y_margin> <!-- from top border. -->
    <style name="infos_style">
      <visible>true</visible>
      <back_color>ROOT/grey19</back_color>
      <back_shadow>0.015</back_shadow> <!-- % of width -->
      <color>black</color>
      <font>arialbd.ttf</font>
      <front_face>cw</front_face>
      <smoothing>true</smoothing>
      <modeling>ROOT</modeling> <!-- to have histo name as info title. -->
    </style>

    <style name="inner_frame_style">
      <visible>true</visible>
      <color>black</color>
      <line_width>1</line_width>
 <!-- <line_pattern>solid</line_pattern> -->
    </style>

    <style name="x_axis">
      <modeling>hplot</modeling>
      <divisions>510</divisions>
      <title_hjust>right</title_hjust>
      <label_to_axis>0.005</label_to_axis>
      <label_height>0.04</label_height>
      <tick_length>0.03</tick_length>
      <title_to_axis>0.05</title_to_axis> <!-- YLAB = 0.05 -->
      <title_height>0.04</title_height>
      <is_log>false</is_log>
    </style>
    <style name="x_axis.line_style">
      <color>black</color>
      <line_width>1</line_width>
    </style>
    <style name="x_axis.ticks_style">
      <color>black</color>
      <line_width>1</line_width>
    </style>
    <style name="x_axis.labels_style"> 
      <color>black</color>
      <scale>0.6</scale> <!-- To have a good matching with ROOT text size -->
      <font>arialbd.ttf</font> <!-- ROOT_62 -->
      <front_face>cw</front_face>
      <smoothing>true</smoothing>
    </style>
    <style name="x_axis.title_style">
      <visible>true</visible>
      <color>black</color>
      <scale>0.6</scale>
      <font>arialbd.ttf</font> <!-- ROOT_62 -->
      <front_face>cw</front_face>
      <smoothing>true</smoothing>
    </style>
    <style name="x_axis.mag_style">
      <color>black</color>
      <scale>0.6</scale>
      <font>arialbd.ttf</font> <!-- ROOT_62 -->
      <front_face>cw</front_face>
      <smoothing>true</smoothing>
    </style>

    <style name="y_axis">
      <modeling>hplot</modeling>
      <divisions>510</divisions>
      <title_hjust>right</title_hjust>
      <label_to_axis>0.005</label_to_axis>
      <label_height>0.04</label_height>
      <tick_length>0.03</tick_length>
      <title_to_axis>0.07</title_to_axis> <!-- XLAB = 0.07 -->
      <title_height>0.04</title_height>
      <is_log>false</is_log>
    </style>
    <style name="y_axis.line_style">
      <color>black</color>
      <line_width>1</line_width>
    </style>
    <style name="y_axis.ticks_style">
      <color>black</color>
      <line_width>1</line_width>
    </style>
    <style name="y_axis.labels_style"> 
      <color>black</color>
      <scale>0.6</scale>
      <font>arialbd.ttf</font> <!-- ROOT_62 -->
      <front_face>cw</front_face>
      <smoothing>true</smoothing>
    </style>
    <style name="y_axis.title_style">
      <visible>true</visible>
      <color>black</color>
      <scale>0.6</scale>
      <font>arialbd.ttf</font> <!-- ROOT_62 -->
      <front_face>cw</front_face>
      <smoothing>true</smoothing>
    </style>
    <style name="y_axis.mag_style">
      <color>black</color>
      <scale>0.6</scale>
      <font>arialbd.ttf</font> <!-- ROOT_62 -->
      <front_face>cw</front_face>
      <smoothing>true</smoothing>
    </style>

    <style name="z_axis">
      <modeling>hplot</modeling>
      <is_log>false</is_log>
    </style>
    <style name="z_axis.line_style">
      <color>black</color>
      <line_width>1</line_width>
    </style>
    <style name="z_axis.ticks_style">
      <color>black</color>
      <line_width>1</line_width>
    </style>
    <style name="z_axis.labels_style"> 
      <color>black</color>
      <scale>0.6</scale>
    </style>
    <style name="z_axis.title_style">
      <color>black</color>
      <scale>0.6</scale>
    </style>
    <style name="z_axis.mag_style">
      <color>black</color>
      <scale>0.6</scale>
    </style>

    <style name="bins_style.0">
      <modeling>top_lines</modeling>
      <color>black</color>
      <line_width>1</line_width>
 <!-- <line_pattern>solid</line_pattern> -->
    </style>

    <style name="func_style.0">
      <modeling>top_lines</modeling>
      <color>black</color>
      <line_width>3</line_width>
 <!-- <line_pattern>solid</line_pattern> -->
    </style>
  </plotter_style>

  <plotter_style name="hippodraw">
    <value_top_margin>0.05</value_top_margin>
    <bottom_margin>0.12</bottom_margin>
    <top_margin>0.16</top_margin>
    <left_margin>0.16</left_margin>
    <right_margin>0.16</right_margin>
    <title_to_axis>0.1</title_to_axis>
    <title_height>0.03</title_height>

<!-- <style name="wall_style"><visible>false</visible></style> -->
    <style name="grid_style">
      <visible>false</visible>
    </style>

    <style name="inner_frame_style">
      <visible>true</visible>
    </style>

    <style name="infos_style">
      <visible>false</visible>
    </style>

    <style name="x_axis">
      <title_hjust>center</title_hjust>
      <title_to_axis>0.07</title_to_axis>
      <title_height>0.035</title_height>
      <label_to_axis>0.015</label_to_axis>
      <label_height>0.02625</label_height> <!-- 0.0175F * 1.5F -->
    </style>
    <style name="y_axis">
      <title_hjust>center</title_hjust>
      <title_to_axis>0.2</title_to_axis>
      <title_height>0.035</title_height>
      <label_height>0.02625</label_height> <!-- 0.0175F * 1.5F -->
    </style>

    <style name="title_style">
      <visible>true</visible>
      <font>helvetica.ttf</font>
      <front_face>cw</front_face>
      <smoothing>true</smoothing>
    </style>

    <style name="x_axis.title_style">
      <visible>true</visible>
      <font>helvetica.ttf</font>
      <front_face>cw</front_face>
      <smoothing>true</smoothing>
    </style>
    <style name="x_axis.labels_style"> 
      <color>black</color>
      <font>helvetica.ttf</font>
      <front_face>cw</front_face>
      <smoothing>true</smoothing>
    </style>

    <style name="y_axis.title_style">
      <visible>true</visible>
      <font>helvetica.ttf</font>
      <front_face>cw</front_face>
      <smoothing>true</smoothing>
    </style>
    <style name="y_axis.labels_style"> 
      <color>black</color>
      <font>helvetica.ttf</font>
      <front_face>cw</front_face>
      <smoothing>true</smoothing>
    </style>

    <style name="z_axis.title_style">
      <visible>true</visible>
      <font>helvetica.ttf</font>
      <front_face>cw</front_face>
      <smoothing>true</smoothing>
    </style>
    <style name="z_axis.labels_style"> 
      <color>black</color>
      <font>helvetica.ttf</font>
      <front_face>cw</front_face>
      <smoothing>true</smoothing>
    </style>

    <style name="errors_style.0">
      <visible>false</visible>
    </style>

    <style name="bins_style.0">
      <modeling>top_lines</modeling>
      <color>black</color>
      <line_width>1</line_width>
 <!-- <line_pattern>solid</line_pattern> -->
    </style>

    <style name="func_style.0">
      <modeling>top_lines</modeling>
      <color>black</color>
      <line_width>1</line_width>
 <!-- <line_pattern>solid</line_pattern> -->
    </style>
  </plotter_style>

  <plotter_style name="exa_hrand">
    <title_hjust>right</title_hjust>
    <style name="errors_style.0">
      <visible>false</visible>
    </style>
    <style name="title_style">
      <font>arialbd.ttf</font>
      <front_face>cw</front_face>
    </style>
  </plotter_style>

  <plotter_style name="exa_icon">
    <style name="bins_style.0">
      <modeling>boxes</modeling>
      <color>darkslategrey</color>
    </style>
    <style name="grid_style">
      <visible>false</visible>
    </style>
    <style name="infos_style">
      <visible>false</visible>
    </style>
    <style name="title_style">
      <font>arialbd.ttf</font>
      <front_face>cw</front_face>
    </style>
  </plotter_style>

  <plotter_style name="exa_fit">
    <style name="bins_style.0">
      <modeling>top_lines</modeling>
      <color>black</color>
    </style>
    <style name="errors_style.0">
      <visible>false</visible>
    </style>
    <style name="func_style.0">
      <modeling>top_lines</modeling>
      <color>red</color>
      <line_width>5</line_width>
    </style>
    <style name="title_style">
      <font>arialbd.ttf</font>
      <front_face>cw</front_face>
    </style>
  </plotter_style>

  <plotter_style name="wall_ROOT_default">
    <copy from="ROOT_default"/>
    <style name="inner_frame_style">
      <visible>true</visible>
      <color>black</color>
      <line_width>5</line_width>
    </style>
    <style name="x_axis.line_style">
      <color>black</color>
      <line_width>5</line_width>
    </style>
    <style name="x_axis.ticks_style">
      <color>black</color>
      <line_width>5</line_width>
    </style>
    <style name="y_axis.line_style">
      <color>black</color>
      <line_width>5</line_width>
    </style>
    <style name="y_axis.ticks_style">
      <color>black</color>
      <line_width>5</line_width>
    </style>

    <style name="bins_style.0">
      <modeling>top_lines</modeling>
      <color>black</color>
      <line_width>5</line_width>
    </style>

    <style name="points_style.0">
      <color>black</color>	
      <marker_size>3</marker_size>
    </style>
  </plotter_style>

  <plotter_style name="lego">
    <shape_automated>false</shape_automated>
    <shape>xyz</shape>
    <style name="bins_style.0">
      <modeling>boxes</modeling>
      <color>grey</color>
      <painting>violet_to_red</painting>
<!--
      <painting>grey_scale</painting>
      <painting>grey_scale_inverse</painting>
      <painting>by_value</painting>
-->
      <color_mapping>black 0 cyan 5 green 10 orange 15 red</color_mapping>
    </style>
  </plotter_style>
</styles>