11.6: Colored Shapes

Last updated
Save as PDF

Page ID: 43727

\( \newcommand{\vecs}[1]{\overset { \scriptstyle \rightharpoonup} {\mathbf{#1}} } \) \( \newcommand{\vecd}[1]{\overset{-\!-\!\rightharpoonup}{\vphantom{a}\smash {#1}}} \)\(\newcommand{\id}{\mathrm{id}}\) \( \newcommand{\Span}{\mathrm{span}}\) \( \newcommand{\kernel}{\mathrm{null}\,}\) \( \newcommand{\range}{\mathrm{range}\,}\) \( \newcommand{\RealPart}{\mathrm{Re}}\) \( \newcommand{\ImaginaryPart}{\mathrm{Im}}\) \( \newcommand{\Argument}{\mathrm{Arg}}\) \( \newcommand{\norm}[1]{\| #1 \|}\) \( \newcommand{\inner}[2]{\langle #1, #2 \rangle}\) \( \newcommand{\Span}{\mathrm{span}}\) \(\newcommand{\id}{\mathrm{id}}\) \( \newcommand{\Span}{\mathrm{span}}\) \( \newcommand{\kernel}{\mathrm{null}\,}\) \( \newcommand{\range}{\mathrm{range}\,}\) \( \newcommand{\RealPart}{\mathrm{Re}}\) \( \newcommand{\ImaginaryPart}{\mathrm{Im}}\) \( \newcommand{\Argument}{\mathrm{Arg}}\) \( \newcommand{\norm}[1]{\| #1 \|}\) \( \newcommand{\inner}[2]{\langle #1, #2 \rangle}\) \( \newcommand{\Span}{\mathrm{span}}\)\(\newcommand{\AA}{\unicode[.8,0]{x212B}}\)

A shape may be colored in various ways. Node shapes understand the message fillColor:, textColor:, borderColor:. Line shapes understand color:. Let’s color the visualization of the collection hierarchy:

view shape rectangle
    size: 10;
    borderColor: [ :cls | ('*Array*' match: cls name)
                            ifTrue: [ Color blue ]
                            ifFalse: [ Color black ] ];
    fillColor: [ :cls | cls hasAbstractMethods ifTrue: [ Color lightGray ] ifFalse: [ Color white]
        ].
view nodes: Collection withAllSubclasses.
view edgesFrom: #superclass.
view treeLayout.

The produced visualization is given in Figure \(\PageIndex{1}\). It easily help identify abstract classes that are not named as “Array” and the ones that are abstract without an abstract method.

Tree hierarchy with abstract classes labeled. — Figure \(\PageIndex{1}\): Abstract classes are in gray and classes with the word "Abstract" in their name are blue.

Similar as with height: and width:, messages to define color either take a symbol, a block or a constant value as argument. The argument is evaluated against the domain object represented by the graphical element (a double dispatch sends the message moValue: to the argument). The use of ifTrue:ifFalse: is not really practicable. Utilities methods are provided for that purpose to easily pick a color from a particular condition. The definition of the shape can simply be:

view shape rectangle
    size: 10;
    if: [ :cls | ('*Array*' match: cls name) ] borderColor: Color blue;
    if: [ :cls | cls hasAbstractMethods ] fillColor: Color lightGray;
...

The method hasAbstractMethods is defined on Behavior and Metaclass in Pharo. By sending the hasAbstractMethods to a class return a boolean value telling us whether the class is abstract or not. We recall that an abstract class in Smalltalk is a class that defines or inherits at least one abstract method (i.e., which contains self subclassResponsibility).