<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>ClutterBindConstraint</title>
<meta name="generator" content="DocBook XSL Stylesheets V1.78.1">
<link rel="home" href="index.html" title="Clutter Reference Manual">
<link rel="up" href="ch05.html" title="Constraints">
<link rel="prev" href="ClutterAlignConstraint.html" title="ClutterAlignConstraint">
<link rel="next" href="ClutterPathConstraint.html" title="ClutterPathConstraint">
<meta name="generator" content="GTK-Doc V1.18.1 (XML mode)">
<link rel="stylesheet" href="style.css" type="text/css">
</head>
<body bgcolor="white" text="black" link="#0000FF" vlink="#840084" alink="#0000FF">
<table class="navigation" id="top" width="100%" summary="Navigation header" cellpadding="2" cellspacing="2">
<tr valign="middle">
<td><a accesskey="p" href="ClutterAlignConstraint.html"><img src="left.png" width="24" height="24" border="0" alt="Prev"></a></td>
<td><a accesskey="u" href="ch05.html"><img src="up.png" width="24" height="24" border="0" alt="Up"></a></td>
<td><a accesskey="h" href="index.html"><img src="home.png" width="24" height="24" border="0" alt="Home"></a></td>
<th width="100%" align="center">Clutter Reference Manual</th>
<td><a accesskey="n" href="ClutterPathConstraint.html"><img src="right.png" width="24" height="24" border="0" alt="Next"></a></td>
</tr>
<tr><td colspan="5" class="shortcuts">
<a href="#ClutterBindConstraint.synopsis" class="shortcut">Top</a>
                   | 
                  <a href="#ClutterBindConstraint.description" class="shortcut">Description</a>
                   | 
                  <a href="#ClutterBindConstraint.object-hierarchy" class="shortcut">Object Hierarchy</a>
                   | 
                  <a href="#ClutterBindConstraint.properties" class="shortcut">Properties</a>
</td></tr>
</table>
<div class="refentry">
<a name="ClutterBindConstraint"></a><div class="titlepage"></div>
<div class="refnamediv"><table width="100%"><tr>
<td valign="top">
<h2><span class="refentrytitle"><a name="ClutterBindConstraint.top_of_page"></a>ClutterBindConstraint</span></h2>
<p>ClutterBindConstraint — A constraint binding the position or size of an actor</p>
</td>
<td valign="top" align="right"></td>
</tr></table></div>
<div class="refsynopsisdiv">
<a name="ClutterBindConstraint.synopsis"></a><h2>Synopsis</h2>
<pre class="synopsis">                    <a class="link" href="ClutterBindConstraint.html#ClutterBindConstraint-struct" title="ClutterBindConstraint">ClutterBindConstraint</a>;
enum                <a class="link" href="ClutterBindConstraint.html#ClutterBindCoordinate" title="enum ClutterBindCoordinate">ClutterBindCoordinate</a>;
<a class="link" href="ClutterConstraint.html" title="ClutterConstraint"><span class="returnvalue">ClutterConstraint</span></a> * <a class="link" href="ClutterBindConstraint.html#clutter-bind-constraint-new" title="clutter_bind_constraint_new ()">clutter_bind_constraint_new</a>         (<em class="parameter"><code><a class="link" href="ClutterActor.html" title="ClutterActor"><span class="type">ClutterActor</span></a> *source</code></em>,
                                                         <em class="parameter"><code><a class="link" href="ClutterBindConstraint.html#ClutterBindCoordinate" title="enum ClutterBindCoordinate"><span class="type">ClutterBindCoordinate</span></a> coordinate</code></em>,
                                                         <em class="parameter"><code><span class="type">gfloat</span> offset</code></em>);
<span class="returnvalue">void</span>                <a class="link" href="ClutterBindConstraint.html#clutter-bind-constraint-set-source" title="clutter_bind_constraint_set_source ()">clutter_bind_constraint_set_source</a>  (<em class="parameter"><code><a class="link" href="ClutterBindConstraint.html" title="ClutterBindConstraint"><span class="type">ClutterBindConstraint</span></a> *constraint</code></em>,
                                                         <em class="parameter"><code><a class="link" href="ClutterActor.html" title="ClutterActor"><span class="type">ClutterActor</span></a> *source</code></em>);
<a class="link" href="ClutterActor.html" title="ClutterActor"><span class="returnvalue">ClutterActor</span></a> *      <a class="link" href="ClutterBindConstraint.html#clutter-bind-constraint-get-source" title="clutter_bind_constraint_get_source ()">clutter_bind_constraint_get_source</a>  (<em class="parameter"><code><a class="link" href="ClutterBindConstraint.html" title="ClutterBindConstraint"><span class="type">ClutterBindConstraint</span></a> *constraint</code></em>);
<span class="returnvalue">void</span>                <a class="link" href="ClutterBindConstraint.html#clutter-bind-constraint-set-coordinate" title="clutter_bind_constraint_set_coordinate ()">clutter_bind_constraint_set_coordinate</a>
                                                        (<em class="parameter"><code><a class="link" href="ClutterBindConstraint.html" title="ClutterBindConstraint"><span class="type">ClutterBindConstraint</span></a> *constraint</code></em>,
                                                         <em class="parameter"><code><a class="link" href="ClutterBindConstraint.html#ClutterBindCoordinate" title="enum ClutterBindCoordinate"><span class="type">ClutterBindCoordinate</span></a> coordinate</code></em>);
<a class="link" href="ClutterBindConstraint.html#ClutterBindCoordinate" title="enum ClutterBindCoordinate"><span class="returnvalue">ClutterBindCoordinate</span></a> <a class="link" href="ClutterBindConstraint.html#clutter-bind-constraint-get-coordinate" title="clutter_bind_constraint_get_coordinate ()">clutter_bind_constraint_get_coordinate</a>
                                                        (<em class="parameter"><code><a class="link" href="ClutterBindConstraint.html" title="ClutterBindConstraint"><span class="type">ClutterBindConstraint</span></a> *constraint</code></em>);
<span class="returnvalue">void</span>                <a class="link" href="ClutterBindConstraint.html#clutter-bind-constraint-set-offset" title="clutter_bind_constraint_set_offset ()">clutter_bind_constraint_set_offset</a>  (<em class="parameter"><code><a class="link" href="ClutterBindConstraint.html" title="ClutterBindConstraint"><span class="type">ClutterBindConstraint</span></a> *constraint</code></em>,
                                                         <em class="parameter"><code><span class="type">gfloat</span> offset</code></em>);
<span class="returnvalue">gfloat</span>              <a class="link" href="ClutterBindConstraint.html#clutter-bind-constraint-get-offset" title="clutter_bind_constraint_get_offset ()">clutter_bind_constraint_get_offset</a>  (<em class="parameter"><code><a class="link" href="ClutterBindConstraint.html" title="ClutterBindConstraint"><span class="type">ClutterBindConstraint</span></a> *constraint</code></em>);
</pre>
</div>
<div class="refsect1">
<a name="ClutterBindConstraint.object-hierarchy"></a><h2>Object Hierarchy</h2>
<pre class="synopsis">
  GObject
   +----GInitiallyUnowned
         +----<a class="link" href="ClutterActorMeta.html" title="ClutterActorMeta">ClutterActorMeta</a>
               +----<a class="link" href="ClutterConstraint.html" title="ClutterConstraint">ClutterConstraint</a>
                     +----ClutterBindConstraint
</pre>
</div>
<div class="refsect1">
<a name="ClutterBindConstraint.properties"></a><h2>Properties</h2>
<pre class="synopsis">
  "<a class="link" href="ClutterBindConstraint.html#ClutterBindConstraint--coordinate" title='The "coordinate" property'>coordinate</a>"               <a class="link" href="ClutterBindConstraint.html#ClutterBindCoordinate" title="enum ClutterBindCoordinate"><span class="type">ClutterBindCoordinate</span></a>  : Read / Write / Construct
  "<a class="link" href="ClutterBindConstraint.html#ClutterBindConstraint--offset" title='The "offset" property'>offset</a>"                   <span class="type">gfloat</span>                : Read / Write / Construct
  "<a class="link" href="ClutterBindConstraint.html#ClutterBindConstraint--source" title='The "source" property'>source</a>"                   <a class="link" href="ClutterActor.html" title="ClutterActor"><span class="type">ClutterActor</span></a>*         : Read / Write / Construct
</pre>
</div>
<div class="refsect1">
<a name="ClutterBindConstraint.description"></a><h2>Description</h2>
<p>
<a class="link" href="ClutterBindConstraint.html" title="ClutterBindConstraint"><span class="type">ClutterBindConstraint</span></a> is a <a class="link" href="ClutterConstraint.html" title="ClutterConstraint"><span class="type">ClutterConstraint</span></a> that binds the
position or the size of the <a class="link" href="ClutterActor.html" title="ClutterActor"><span class="type">ClutterActor</span></a> to which it is applied
to the the position or the size of another <a class="link" href="ClutterActor.html" title="ClutterActor"><span class="type">ClutterActor</span></a>, or
"source".
</p>
<p>
An offset can be applied to the constraint, to avoid overlapping. The offset
can also be animated. For instance, the following code will set up three
actors to be bound to the same origin:
</p>
<p>
</p>
<div class="informalexample">
  <table class="listing_frame" border="0" cellpadding="0" cellspacing="0">
    <tbody>
      <tr>
        <td class="listing_lines" align="right"><pre>1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24</pre></td>
        <td class="listing_code"><pre class="programlisting"><span class="comment">/* source */</span>
<span class="normal">rect</span><span class="symbol">[</span><span class="number">0</span><span class="symbol">]</span><span class="normal"> </span><span class="symbol">=</span><span class="normal"> </span><span class="function"><a href="ClutterRectangle.html#clutter-rectangle-new-with-color">clutter_rectangle_new_with_color</a></span><span class="normal"> </span><span class="symbol">(&amp;</span><span class="normal">red_color</span><span class="symbol">);</span>
<span class="function"><a href="ClutterActor.html#clutter-actor-set-position">clutter_actor_set_position</a></span><span class="normal"> </span><span class="symbol">(</span><span class="normal">rect</span><span class="symbol">[</span><span class="number">0</span><span class="symbol">],</span><span class="normal"> x_pos</span><span class="symbol">,</span><span class="normal"> y_pos</span><span class="symbol">);</span>
<span class="function"><a href="ClutterActor.html#clutter-actor-set-size">clutter_actor_set_size</a></span><span class="normal"> </span><span class="symbol">(</span><span class="normal">rect</span><span class="symbol">[</span><span class="number">0</span><span class="symbol">],</span><span class="normal"> </span><span class="number">100</span><span class="symbol">,</span><span class="normal"> </span><span class="number">100</span><span class="symbol">);</span>

<span class="comment">/* second rectangle */</span>
<span class="normal">rect</span><span class="symbol">[</span><span class="number">1</span><span class="symbol">]</span><span class="normal"> </span><span class="symbol">=</span><span class="normal"> </span><span class="function"><a href="ClutterRectangle.html#clutter-rectangle-new-with-color">clutter_rectangle_new_with_color</a></span><span class="normal"> </span><span class="symbol">(&amp;</span><span class="normal">green_color</span><span class="symbol">);</span>
<span class="function"><a href="ClutterActor.html#clutter-actor-set-size">clutter_actor_set_size</a></span><span class="normal"> </span><span class="symbol">(</span><span class="normal">rect</span><span class="symbol">[</span><span class="number">1</span><span class="symbol">],</span><span class="normal"> </span><span class="number">100</span><span class="symbol">,</span><span class="normal"> </span><span class="number">100</span><span class="symbol">);</span>
<span class="function"><a href="ClutterActor.html#clutter-actor-set-opacity">clutter_actor_set_opacity</a></span><span class="normal"> </span><span class="symbol">(</span><span class="normal">rect</span><span class="symbol">[</span><span class="number">1</span><span class="symbol">],</span><span class="normal"> </span><span class="number">0</span><span class="symbol">);</span>

<span class="normal">constraint </span><span class="symbol">=</span><span class="normal"> </span><span class="function"><a href="ClutterBindConstraint.html#clutter-bind-constraint-new">clutter_bind_constraint_new</a></span><span class="normal"> </span><span class="symbol">(</span><span class="normal">rect</span><span class="symbol">[</span><span class="number">0</span><span class="symbol">],</span><span class="normal"> <a href="ClutterBindConstraint.html#CLUTTER-BIND-X:CAPS">CLUTTER_BIND_X</a></span><span class="symbol">,</span><span class="normal"> </span><span class="number">0.0</span><span class="symbol">);</span>
<span class="function"><a href="ClutterActor.html#clutter-actor-add-constraint-with-name">clutter_actor_add_constraint_with_name</a></span><span class="normal"> </span><span class="symbol">(</span><span class="normal">rect</span><span class="symbol">[</span><span class="number">1</span><span class="symbol">],</span><span class="normal"> </span><span class="string">"green-x"</span><span class="symbol">,</span><span class="normal"> constraint</span><span class="symbol">);</span>
<span class="normal">constraint </span><span class="symbol">=</span><span class="normal"> </span><span class="function"><a href="ClutterBindConstraint.html#clutter-bind-constraint-new">clutter_bind_constraint_new</a></span><span class="normal"> </span><span class="symbol">(</span><span class="normal">rect</span><span class="symbol">[</span><span class="number">0</span><span class="symbol">],</span><span class="normal"> <a href="ClutterBindConstraint.html#CLUTTER-BIND-Y:CAPS">CLUTTER_BIND_Y</a></span><span class="symbol">,</span><span class="normal"> </span><span class="number">0.0</span><span class="symbol">);</span>
<span class="function"><a href="ClutterActor.html#clutter-actor-add-constraint-with-name">clutter_actor_add_constraint_with_name</a></span><span class="normal"> </span><span class="symbol">(</span><span class="normal">rect</span><span class="symbol">[</span><span class="number">1</span><span class="symbol">],</span><span class="normal"> </span><span class="string">"green-y"</span><span class="symbol">,</span><span class="normal"> constraint</span><span class="symbol">);</span>

<span class="comment">/* third rectangle */</span>
<span class="normal">rect</span><span class="symbol">[</span><span class="number">2</span><span class="symbol">]</span><span class="normal"> </span><span class="symbol">=</span><span class="normal"> </span><span class="function"><a href="ClutterRectangle.html#clutter-rectangle-new-with-color">clutter_rectangle_new_with_color</a></span><span class="normal"> </span><span class="symbol">(&amp;</span><span class="normal">blue_color</span><span class="symbol">);</span>
<span class="function"><a href="ClutterActor.html#clutter-actor-set-size">clutter_actor_set_size</a></span><span class="normal"> </span><span class="symbol">(</span><span class="normal">rect</span><span class="symbol">[</span><span class="number">2</span><span class="symbol">],</span><span class="normal"> </span><span class="number">100</span><span class="symbol">,</span><span class="normal"> </span><span class="number">100</span><span class="symbol">);</span>
<span class="function"><a href="ClutterActor.html#clutter-actor-set-opacity">clutter_actor_set_opacity</a></span><span class="normal"> </span><span class="symbol">(</span><span class="normal">rect</span><span class="symbol">[</span><span class="number">2</span><span class="symbol">],</span><span class="normal"> </span><span class="number">0</span><span class="symbol">);</span>

<span class="normal">constraint </span><span class="symbol">=</span><span class="normal"> </span><span class="function"><a href="ClutterBindConstraint.html#clutter-bind-constraint-new">clutter_bind_constraint_new</a></span><span class="normal"> </span><span class="symbol">(</span><span class="normal">rect</span><span class="symbol">[</span><span class="number">0</span><span class="symbol">],</span><span class="normal"> <a href="ClutterBindConstraint.html#CLUTTER-BIND-X:CAPS">CLUTTER_BIND_X</a></span><span class="symbol">,</span><span class="normal"> </span><span class="number">0.0</span><span class="symbol">);</span>
<span class="function"><a href="ClutterActor.html#clutter-actor-add-constraint-with-name">clutter_actor_add_constraint_with_name</a></span><span class="normal"> </span><span class="symbol">(</span><span class="normal">rect</span><span class="symbol">[</span><span class="number">2</span><span class="symbol">],</span><span class="normal"> </span><span class="string">"blue-x"</span><span class="symbol">,</span><span class="normal"> constraint</span><span class="symbol">);</span>
<span class="normal">constraint </span><span class="symbol">=</span><span class="normal"> </span><span class="function"><a href="ClutterBindConstraint.html#clutter-bind-constraint-new">clutter_bind_constraint_new</a></span><span class="normal"> </span><span class="symbol">(</span><span class="normal">rect</span><span class="symbol">[</span><span class="number">0</span><span class="symbol">],</span><span class="normal"> <a href="ClutterBindConstraint.html#CLUTTER-BIND-Y:CAPS">CLUTTER_BIND_Y</a></span><span class="symbol">,</span><span class="normal"> </span><span class="number">0.0</span><span class="symbol">);</span>
<span class="function"><a href="ClutterActor.html#clutter-actor-add-constraint-with-name">clutter_actor_add_constraint_with_name</a></span><span class="normal"> </span><span class="symbol">(</span><span class="normal">rect</span><span class="symbol">[</span><span class="number">2</span><span class="symbol">],</span><span class="normal"> </span><span class="string">"blue-y"</span><span class="symbol">,</span><span class="normal"> constraint</span><span class="symbol">);</span></pre></td>
      </tr>
    </tbody>
  </table>
</div>

<p>
</p>
<p>
The following code animates the second and third rectangles to "expand"
them horizontally from underneath the first rectangle:
</p>
<p>
</p>
<div class="informalexample">
  <table class="listing_frame" border="0" cellpadding="0" cellspacing="0">
    <tbody>
      <tr>
        <td class="listing_lines" align="right"><pre>1
2
3
4
5
6
7
8</pre></td>
        <td class="listing_code"><pre class="programlisting"><span class="function"><a href="clutter-Implicit-Animations.html#clutter-actor-animate">clutter_actor_animate</a></span><span class="normal"> </span><span class="symbol">(</span><span class="normal">rect</span><span class="symbol">[</span><span class="number">1</span><span class="symbol">],</span><span class="normal"> <a href="ClutterTimeline.html#CLUTTER-EASE-OUT-CUBIC:CAPS">CLUTTER_EASE_OUT_CUBIC</a></span><span class="symbol">,</span><span class="normal"> </span><span class="number">250</span><span class="symbol">,</span>
<span class="normal">                       </span><span class="string">"@constraints.green-x.offset"</span><span class="symbol">,</span><span class="normal"> </span><span class="number">100.0</span><span class="symbol">,</span>
<span class="normal">                       </span><span class="string">"opacity"</span><span class="symbol">,</span><span class="normal"> </span><span class="number">255</span><span class="symbol">,</span>
<span class="normal">                       NULL</span><span class="symbol">);</span>
<span class="function"><a href="clutter-Implicit-Animations.html#clutter-actor-animate">clutter_actor_animate</a></span><span class="normal"> </span><span class="symbol">(</span><span class="normal">rect</span><span class="symbol">[</span><span class="number">2</span><span class="symbol">],</span><span class="normal"> <a href="ClutterTimeline.html#CLUTTER-EASE-OUT-CUBIC:CAPS">CLUTTER_EASE_OUT_CUBIC</a></span><span class="symbol">,</span><span class="normal"> </span><span class="number">250</span><span class="symbol">,</span>
<span class="normal">                       </span><span class="string">"@constraints.blue-x.offset"</span><span class="symbol">,</span><span class="normal"> </span><span class="number">200.0</span><span class="symbol">,</span>
<span class="normal">                       </span><span class="string">"opacity"</span><span class="symbol">,</span><span class="normal"> </span><span class="number">255</span><span class="symbol">,</span>
<span class="normal">                       NULL</span><span class="symbol">);</span></pre></td>
      </tr>
    </tbody>
  </table>
</div>

<p>
</p>
<p>
</p>
<div class="example">
<a name="bind-constraint-example"></a><p class="title"><b>Example 7. Animating the offset property of ClutterBindConstraint</b></p>
<div class="example-contents">
<pre class="programlisting">
#include &lt;stdlib.h&gt;
#include &lt;clutter/clutter.h&gt;

#define RECT_SIZE       128

#define H_PADDING       32
#define V_PADDING       32

enum
{
  NorthWest,    North,  NorthEast,
  West,         Center, East,
  SouthWest,    South,  SouthEast,

  N_RECTS
};

static ClutterActor *rects[N_RECTS] = { NULL, };
static const gchar *colors[N_RECTS] = {
  "#8ae234", "#73d216", "#4e9a06",
  "#729fcf", "#3465a4", "#204a87",
  "#ef2929", "#cc0000", "#a40000"
};
static const gchar *names[N_RECTS] = {
  "North West", "North",  "North East",
  "West",       "Center", "East",
  "South West", "South",  "South East"
};

static const gchar *desaturare_glsl_shader =
"uniform sampler2D tex;\n"
"uniform float factor;\n"
"\n"
"vec3 desaturate (const vec3 color, const float desaturation)\n"
"{\n"
"  const vec3 gray_conv = vec3 (0.299, 0.587, 0.114);\n"
"  vec3 gray = vec3 (dot (gray_conv, color));\n"
"  return vec3 (mix (color.rgb, gray, desaturation));\n"
"}\n"
"\n"
"void main ()\n"
"{\n"
"  vec4 color = cogl_color_in * texture2D (tex, vec2 (cogl_tex_coord_in[0].xy));\n"
"  color.rgb = desaturate (color.rgb, factor);\n"
"  cogl_color_out = color;\n"
"}\n";

static gboolean      is_expanded = FALSE;

static gboolean
on_button_release (ClutterActor *actor,
                   ClutterEvent *event,
                   gpointer      data G_GNUC_UNUSED)
{
  if (!is_expanded)
    {
      gfloat north_offset, south_offset;
      gfloat west_offset, east_offset;

      /* expand the 8 rectangles by animating the offset of the
       * bind constraints
       */

      north_offset = (clutter_actor_get_height (rects[Center]) + V_PADDING)
                   * -1.0f;
      south_offset = (clutter_actor_get_height (rects[Center]) + V_PADDING);

      west_offset = (clutter_actor_get_width (rects[Center]) + H_PADDING)
                  * -1.0f;
      east_offset = (clutter_actor_get_width (rects[Center]) + H_PADDING);

      clutter_actor_animate (rects[NorthWest], CLUTTER_EASE_OUT_EXPO, 500,
                             "opacity", 255,
                             "@constraints.x-bind.offset", west_offset,
                             "@constraints.y-bind.offset", north_offset,
                             "reactive", TRUE,
                             NULL);
      clutter_actor_animate (rects[North], CLUTTER_EASE_OUT_EXPO, 500,
                             "opacity", 255,
                             "@constraints.y-bind.offset", north_offset,
                             "reactive", TRUE,
                             NULL);
      clutter_actor_animate (rects[NorthEast], CLUTTER_EASE_OUT_EXPO, 500,
                             "opacity", 255,
                             "@constraints.x-bind.offset", east_offset,
                             "@constraints.y-bind.offset", north_offset,
                             "reactive", TRUE,
                             NULL);

      clutter_actor_animate (rects[West], CLUTTER_EASE_OUT_EXPO, 500,
                             "opacity", 255,
                             "@constraints.x-bind.offset", west_offset,
                             "reactive", TRUE,
                             NULL);
      /* turn on the desaturation effect and set the center
       * rectangle not reactive
       */
      clutter_actor_animate (rects[Center], CLUTTER_LINEAR, 500,
                             "@effects.desaturate.enabled", TRUE,
                             "reactive", FALSE,
                             NULL);
      clutter_actor_animate (rects[East], CLUTTER_EASE_OUT_EXPO, 500,
                             "opacity", 255,
                             "@constraints.x-bind.offset", east_offset,
                             "reactive", TRUE,
                             NULL);

      clutter_actor_animate (rects[SouthWest], CLUTTER_EASE_OUT_EXPO, 500,
                             "opacity", 255,
                             "@constraints.x-bind.offset", west_offset,
                             "@constraints.y-bind.offset", south_offset,
                             "reactive", TRUE,
                             NULL);
      clutter_actor_animate (rects[South], CLUTTER_EASE_OUT_EXPO, 500,
                             "opacity", 255,
                             "@constraints.y-bind.offset", south_offset,
                             "reactive", TRUE,
                             NULL);
      clutter_actor_animate (rects[SouthEast], CLUTTER_EASE_OUT_EXPO, 500,
                             "opacity", 255,
                             "@constraints.x-bind.offset", east_offset,
                             "@constraints.y-bind.offset", south_offset,
                             "reactive", TRUE,
                             NULL);
    }
  else
    {
      gint i;

      clutter_actor_animate (rects[Center], CLUTTER_LINEAR, 500,
                             "@effects.desaturate.enabled", FALSE,
                             "reactive", TRUE,
                             NULL);

      for (i = NorthWest; i &lt; N_RECTS; i++)
        {
          if (i == Center)
            continue;

          /* put the 8 rectangles back into their initial state */
          clutter_actor_animate (rects[i], CLUTTER_EASE_OUT_EXPO, 500,
                                 "opacity", 0,
                                 "@constraints.x-bind.offset", 0.0f,
                                 "@constraints.y-bind.offset", 0.0f,
                                 "reactive", FALSE,
                                 NULL);
        }
    }

  is_expanded = !is_expanded;

  g_print ("Selected: [%s]\n", clutter_actor_get_name (actor));

  return TRUE;
}

G_MODULE_EXPORT const char *
test_bind_constraint_describe (void)
{
  return "Demonstrate the usage of ClutterBindConstraint";
}

G_MODULE_EXPORT int
test_bind_constraint_main (int argc, char *argv[])
{
  ClutterActor *stage, *rect;
  ClutterConstraint *constraint;
  ClutterEffect *effect;
  ClutterColor rect_color;
  gint i;

  if (clutter_init (&amp;argc, &amp;argv) != CLUTTER_INIT_SUCCESS)
    return 1;

  stage = clutter_stage_new ();
  g_signal_connect (stage, "destroy", G_CALLBACK (clutter_main_quit), NULL);
  clutter_stage_set_title (CLUTTER_STAGE (stage), "Constraints");
  clutter_stage_set_user_resizable (CLUTTER_STAGE (stage), TRUE);
  clutter_actor_set_size (stage, 800, 600);

  /* main rectangle */
  clutter_color_from_string (&amp;rect_color, "#3465a4");
  rect = clutter_actor_new ();
  g_signal_connect (rect, "button-release-event",
                    G_CALLBACK (on_button_release),
                    NULL);
  clutter_actor_set_background_color (rect, &amp;rect_color);
  clutter_actor_set_size (rect, RECT_SIZE, RECT_SIZE);
  clutter_actor_set_reactive (rect, TRUE);
  clutter_actor_set_name (rect, names[Center]);
  clutter_actor_add_child (stage, rect);

  /* align the center rectangle to the center of the stage */
  constraint = clutter_align_constraint_new (stage, CLUTTER_ALIGN_BOTH, 0.5);
  clutter_actor_add_constraint_with_name (rect, "align", constraint);

  /* this is the equivalent of the DesaturateEffect; we cannot animate
   * the factor because the animation API only understands GObject
   * properties; so we use the ActorMeta:enabled property to toggle
   * the shader
   */
  effect = clutter_shader_effect_new (CLUTTER_FRAGMENT_SHADER);
  clutter_shader_effect_set_shader_source (CLUTTER_SHADER_EFFECT (effect),
                                           desaturare_glsl_shader);
  clutter_shader_effect_set_uniform (CLUTTER_SHADER_EFFECT (effect),
                                     "tex", G_TYPE_INT, 1, 0);
  clutter_shader_effect_set_uniform (CLUTTER_SHADER_EFFECT (effect),
                                     "factor", G_TYPE_FLOAT, 1, 0.66);
  clutter_actor_meta_set_enabled (CLUTTER_ACTOR_META (effect), FALSE);
  clutter_actor_add_effect_with_name (rect, "desaturate", effect);

  rects[Center] = rect;

  /* build the other rectangles, and bind their position and size
   * to the center rectangle. we are going to animate the offset
   * of the BindConstraints
   */
  for (i = 0; i &lt; N_RECTS; i++)
    {
      if (i == Center)
        continue;

      clutter_color_from_string (&amp;rect_color, colors[i]);

      rect = clutter_actor_new ();
      clutter_actor_set_background_color (rect, &amp;rect_color);
      clutter_actor_set_opacity (rect, 0);
      clutter_actor_set_name (rect, names[i]);
      clutter_actor_add_child (stage, rect);

      constraint = clutter_bind_constraint_new (rects[Center], CLUTTER_BIND_X, 0.0);
      clutter_actor_add_constraint_with_name (rect, "x-bind", constraint);

      constraint = clutter_bind_constraint_new (rects[Center], CLUTTER_BIND_Y, 0.0);
      clutter_actor_add_constraint_with_name (rect, "y-bind", constraint);

      constraint = clutter_bind_constraint_new (rects[Center], CLUTTER_BIND_SIZE, 0.0);
      clutter_actor_add_constraint_with_name (rect, "size-bind", constraint);

      g_signal_connect (rect, "button-release-event",
                        G_CALLBACK (on_button_release),
                        NULL);

      rects[i] = rect;
    }

  clutter_actor_show (stage);

  clutter_main ();

  return EXIT_SUCCESS;
}

  </pre>
<p>The example above creates eight rectangles and binds them to a
  rectangle positioned in the center of the stage; when the user presses
  the center rectangle, the <a class="link" href="ClutterBindConstraint.html#ClutterBindConstraint--offset" title='The "offset" property'><span class="type">"offset"</span></a> property is
  animated through the <a class="link" href="clutter-Implicit-Animations.html#clutter-actor-animate" title="clutter_actor_animate ()"><code class="function">clutter_actor_animate()</code></a> function to lay out the
  eight rectangles around the center one. Pressing one of the outer
  rectangles will animate the offset back to 0.</p>
</div>
</div>
<p><br class="example-break">
</p>
<p>
<a class="link" href="ClutterBindConstraint.html" title="ClutterBindConstraint"><span class="type">ClutterBindConstraint</span></a> is available since Clutter 1.4
</p>
</div>
<div class="refsect1">
<a name="ClutterBindConstraint.details"></a><h2>Details</h2>
<div class="refsect2">
<a name="ClutterBindConstraint-struct"></a><h3>ClutterBindConstraint</h3>
<pre class="programlisting">typedef struct _ClutterBindConstraint ClutterBindConstraint;</pre>
<p>
<span class="structname">ClutterBindConstraint</span> is an opaque structure
whose members cannot be directly accessed
</p>
<p class="since">Since 1.4</p>
</div>
<hr>
<div class="refsect2">
<a name="ClutterBindCoordinate"></a><h3>enum ClutterBindCoordinate</h3>
<pre class="programlisting">typedef enum {
 /*&lt; prefix=CLUTTER_BIND &gt;*/
  CLUTTER_BIND_X,
  CLUTTER_BIND_Y,
  CLUTTER_BIND_WIDTH,
  CLUTTER_BIND_HEIGHT,
  CLUTTER_BIND_POSITION,
  CLUTTER_BIND_SIZE,
  CLUTTER_BIND_ALL
} ClutterBindCoordinate;
</pre>
<p>
Specifies which property should be used in a binding
</p>
<div class="variablelist"><table border="0" class="variablelist">
<colgroup>
<col align="left" valign="top">
<col>
</colgroup>
<tbody>
<tr>
<td><p><a name="CLUTTER-BIND-X:CAPS"></a><span class="term"><code class="literal">CLUTTER_BIND_X</code></span></p></td>
<td>Bind the X coordinate
</td>
</tr>
<tr>
<td><p><a name="CLUTTER-BIND-Y:CAPS"></a><span class="term"><code class="literal">CLUTTER_BIND_Y</code></span></p></td>
<td>Bind the Y coordinate
</td>
</tr>
<tr>
<td><p><a name="CLUTTER-BIND-WIDTH:CAPS"></a><span class="term"><code class="literal">CLUTTER_BIND_WIDTH</code></span></p></td>
<td>Bind the width
</td>
</tr>
<tr>
<td><p><a name="CLUTTER-BIND-HEIGHT:CAPS"></a><span class="term"><code class="literal">CLUTTER_BIND_HEIGHT</code></span></p></td>
<td>Bind the height
</td>
</tr>
<tr>
<td><p><a name="CLUTTER-BIND-POSITION:CAPS"></a><span class="term"><code class="literal">CLUTTER_BIND_POSITION</code></span></p></td>
<td>Equivalent to to <a class="link" href="ClutterBindConstraint.html#CLUTTER-BIND-X:CAPS"><code class="literal">CLUTTER_BIND_X</code></a> and
  <a class="link" href="ClutterBindConstraint.html#CLUTTER-BIND-Y:CAPS"><code class="literal">CLUTTER_BIND_Y</code></a> (added in Clutter 1.6)
</td>
</tr>
<tr>
<td><p><a name="CLUTTER-BIND-SIZE:CAPS"></a><span class="term"><code class="literal">CLUTTER_BIND_SIZE</code></span></p></td>
<td>Equivalent to <a class="link" href="ClutterBindConstraint.html#CLUTTER-BIND-WIDTH:CAPS"><code class="literal">CLUTTER_BIND_WIDTH</code></a> and
  <a class="link" href="ClutterBindConstraint.html#CLUTTER-BIND-HEIGHT:CAPS"><code class="literal">CLUTTER_BIND_HEIGHT</code></a> (added in Clutter 1.6)
</td>
</tr>
<tr>
<td><p><a name="CLUTTER-BIND-ALL:CAPS"></a><span class="term"><code class="literal">CLUTTER_BIND_ALL</code></span></p></td>
<td>Equivalent to <a class="link" href="ClutterBindConstraint.html#CLUTTER-BIND-POSITION:CAPS"><code class="literal">CLUTTER_BIND_POSITION</code></a> and
  <a class="link" href="ClutterBindConstraint.html#CLUTTER-BIND-SIZE:CAPS"><code class="literal">CLUTTER_BIND_SIZE</code></a> (added in Clutter 1.10)
</td>
</tr>
</tbody>
</table></div>
<p class="since">Since 1.4</p>
</div>
<hr>
<div class="refsect2">
<a name="clutter-bind-constraint-new"></a><h3>clutter_bind_constraint_new ()</h3>
<pre class="programlisting"><a class="link" href="ClutterConstraint.html" title="ClutterConstraint"><span class="returnvalue">ClutterConstraint</span></a> * clutter_bind_constraint_new         (<em class="parameter"><code><a class="link" href="ClutterActor.html" title="ClutterActor"><span class="type">ClutterActor</span></a> *source</code></em>,
                                                         <em class="parameter"><code><a class="link" href="ClutterBindConstraint.html#ClutterBindCoordinate" title="enum ClutterBindCoordinate"><span class="type">ClutterBindCoordinate</span></a> coordinate</code></em>,
                                                         <em class="parameter"><code><span class="type">gfloat</span> offset</code></em>);</pre>
<p>
Creates a new constraint, binding a <a class="link" href="ClutterActor.html" title="ClutterActor"><span class="type">ClutterActor</span></a>'s position to
the given <em class="parameter"><code>coordinate</code></em> of the position of <em class="parameter"><code>source</code></em>
</p>
<div class="variablelist"><table border="0" class="variablelist">
<colgroup>
<col align="left" valign="top">
<col>
</colgroup>
<tbody>
<tr>
<td><p><span class="term"><em class="parameter"><code>source</code></em> :</span></p></td>
<td>the <a class="link" href="ClutterActor.html" title="ClutterActor"><span class="type">ClutterActor</span></a> to use as the source of
the binding, or <code class="literal">NULL</code>. <span class="annotation">[<acronym title="NULL is ok, both for passing and for returning."><span class="acronym">allow-none</span></acronym>]</span>
</td>
</tr>
<tr>
<td><p><span class="term"><em class="parameter"><code>coordinate</code></em> :</span></p></td>
<td>the coordinate to bind</td>
</tr>
<tr>
<td><p><span class="term"><em class="parameter"><code>offset</code></em> :</span></p></td>
<td>the offset to apply to the binding, in pixels</td>
</tr>
<tr>
<td><p><span class="term"><span class="emphasis"><em>Returns</em></span> :</span></p></td>
<td>the newly created <a class="link" href="ClutterBindConstraint.html" title="ClutterBindConstraint"><span class="type">ClutterBindConstraint</span></a>
</td>
</tr>
</tbody>
</table></div>
<p class="since">Since 1.4</p>
</div>
<hr>
<div class="refsect2">
<a name="clutter-bind-constraint-set-source"></a><h3>clutter_bind_constraint_set_source ()</h3>
<pre class="programlisting"><span class="returnvalue">void</span>                clutter_bind_constraint_set_source  (<em class="parameter"><code><a class="link" href="ClutterBindConstraint.html" title="ClutterBindConstraint"><span class="type">ClutterBindConstraint</span></a> *constraint</code></em>,
                                                         <em class="parameter"><code><a class="link" href="ClutterActor.html" title="ClutterActor"><span class="type">ClutterActor</span></a> *source</code></em>);</pre>
<p>
Sets the source <a class="link" href="ClutterActor.html" title="ClutterActor"><span class="type">ClutterActor</span></a> for the constraint
</p>
<div class="variablelist"><table border="0" class="variablelist">
<colgroup>
<col align="left" valign="top">
<col>
</colgroup>
<tbody>
<tr>
<td><p><span class="term"><em class="parameter"><code>constraint</code></em> :</span></p></td>
<td>a <a class="link" href="ClutterBindConstraint.html" title="ClutterBindConstraint"><span class="type">ClutterBindConstraint</span></a>
</td>
</tr>
<tr>
<td><p><span class="term"><em class="parameter"><code>source</code></em> :</span></p></td>
<td>a <a class="link" href="ClutterActor.html" title="ClutterActor"><span class="type">ClutterActor</span></a>, or <code class="literal">NULL</code> to unset the source. <span class="annotation">[<acronym title="NULL is ok, both for passing and for returning."><span class="acronym">allow-none</span></acronym>]</span>
</td>
</tr>
</tbody>
</table></div>
<p class="since">Since 1.4</p>
</div>
<hr>
<div class="refsect2">
<a name="clutter-bind-constraint-get-source"></a><h3>clutter_bind_constraint_get_source ()</h3>
<pre class="programlisting"><a class="link" href="ClutterActor.html" title="ClutterActor"><span class="returnvalue">ClutterActor</span></a> *      clutter_bind_constraint_get_source  (<em class="parameter"><code><a class="link" href="ClutterBindConstraint.html" title="ClutterBindConstraint"><span class="type">ClutterBindConstraint</span></a> *constraint</code></em>);</pre>
<p>
Retrieves the <a class="link" href="ClutterActor.html" title="ClutterActor"><span class="type">ClutterActor</span></a> set using <a class="link" href="ClutterBindConstraint.html#clutter-bind-constraint-set-source" title="clutter_bind_constraint_set_source ()"><code class="function">clutter_bind_constraint_set_source()</code></a>
</p>
<div class="variablelist"><table border="0" class="variablelist">
<colgroup>
<col align="left" valign="top">
<col>
</colgroup>
<tbody>
<tr>
<td><p><span class="term"><em class="parameter"><code>constraint</code></em> :</span></p></td>
<td>a <a class="link" href="ClutterBindConstraint.html" title="ClutterBindConstraint"><span class="type">ClutterBindConstraint</span></a>
</td>
</tr>
<tr>
<td><p><span class="term"><span class="emphasis"><em>Returns</em></span> :</span></p></td>
<td>a pointer to the source actor. <span class="annotation">[<acronym title="Don't free data after the code is done."><span class="acronym">transfer none</span></acronym>]</span>
</td>
</tr>
</tbody>
</table></div>
<p class="since">Since 1.4</p>
</div>
<hr>
<div class="refsect2">
<a name="clutter-bind-constraint-set-coordinate"></a><h3>clutter_bind_constraint_set_coordinate ()</h3>
<pre class="programlisting"><span class="returnvalue">void</span>                clutter_bind_constraint_set_coordinate
                                                        (<em class="parameter"><code><a class="link" href="ClutterBindConstraint.html" title="ClutterBindConstraint"><span class="type">ClutterBindConstraint</span></a> *constraint</code></em>,
                                                         <em class="parameter"><code><a class="link" href="ClutterBindConstraint.html#ClutterBindCoordinate" title="enum ClutterBindCoordinate"><span class="type">ClutterBindCoordinate</span></a> coordinate</code></em>);</pre>
<p>
Sets the coordinate to bind in the constraint
</p>
<div class="variablelist"><table border="0" class="variablelist">
<colgroup>
<col align="left" valign="top">
<col>
</colgroup>
<tbody>
<tr>
<td><p><span class="term"><em class="parameter"><code>constraint</code></em> :</span></p></td>
<td>a <a class="link" href="ClutterBindConstraint.html" title="ClutterBindConstraint"><span class="type">ClutterBindConstraint</span></a>
</td>
</tr>
<tr>
<td><p><span class="term"><em class="parameter"><code>coordinate</code></em> :</span></p></td>
<td>the coordinate to bind</td>
</tr>
</tbody>
</table></div>
<p class="since">Since 1.4</p>
</div>
<hr>
<div class="refsect2">
<a name="clutter-bind-constraint-get-coordinate"></a><h3>clutter_bind_constraint_get_coordinate ()</h3>
<pre class="programlisting"><a class="link" href="ClutterBindConstraint.html#ClutterBindCoordinate" title="enum ClutterBindCoordinate"><span class="returnvalue">ClutterBindCoordinate</span></a> clutter_bind_constraint_get_coordinate
                                                        (<em class="parameter"><code><a class="link" href="ClutterBindConstraint.html" title="ClutterBindConstraint"><span class="type">ClutterBindConstraint</span></a> *constraint</code></em>);</pre>
<p>
Retrieves the bound coordinate of the constraint
</p>
<div class="variablelist"><table border="0" class="variablelist">
<colgroup>
<col align="left" valign="top">
<col>
</colgroup>
<tbody>
<tr>
<td><p><span class="term"><em class="parameter"><code>constraint</code></em> :</span></p></td>
<td>a <a class="link" href="ClutterBindConstraint.html" title="ClutterBindConstraint"><span class="type">ClutterBindConstraint</span></a>
</td>
</tr>
<tr>
<td><p><span class="term"><span class="emphasis"><em>Returns</em></span> :</span></p></td>
<td>the bound coordinate</td>
</tr>
</tbody>
</table></div>
<p class="since">Since 1.4</p>
</div>
<hr>
<div class="refsect2">
<a name="clutter-bind-constraint-set-offset"></a><h3>clutter_bind_constraint_set_offset ()</h3>
<pre class="programlisting"><span class="returnvalue">void</span>                clutter_bind_constraint_set_offset  (<em class="parameter"><code><a class="link" href="ClutterBindConstraint.html" title="ClutterBindConstraint"><span class="type">ClutterBindConstraint</span></a> *constraint</code></em>,
                                                         <em class="parameter"><code><span class="type">gfloat</span> offset</code></em>);</pre>
<p>
Sets the offset to be applied to the constraint
</p>
<div class="variablelist"><table border="0" class="variablelist">
<colgroup>
<col align="left" valign="top">
<col>
</colgroup>
<tbody>
<tr>
<td><p><span class="term"><em class="parameter"><code>constraint</code></em> :</span></p></td>
<td>a <a class="link" href="ClutterBindConstraint.html" title="ClutterBindConstraint"><span class="type">ClutterBindConstraint</span></a>
</td>
</tr>
<tr>
<td><p><span class="term"><em class="parameter"><code>offset</code></em> :</span></p></td>
<td>the offset to apply, in pixels</td>
</tr>
</tbody>
</table></div>
<p class="since">Since 1.4</p>
</div>
<hr>
<div class="refsect2">
<a name="clutter-bind-constraint-get-offset"></a><h3>clutter_bind_constraint_get_offset ()</h3>
<pre class="programlisting"><span class="returnvalue">gfloat</span>              clutter_bind_constraint_get_offset  (<em class="parameter"><code><a class="link" href="ClutterBindConstraint.html" title="ClutterBindConstraint"><span class="type">ClutterBindConstraint</span></a> *constraint</code></em>);</pre>
<p>
Retrieves the offset set using <a class="link" href="ClutterBindConstraint.html#clutter-bind-constraint-set-offset" title="clutter_bind_constraint_set_offset ()"><code class="function">clutter_bind_constraint_set_offset()</code></a>
</p>
<div class="variablelist"><table border="0" class="variablelist">
<colgroup>
<col align="left" valign="top">
<col>
</colgroup>
<tbody>
<tr>
<td><p><span class="term"><em class="parameter"><code>constraint</code></em> :</span></p></td>
<td>a <a class="link" href="ClutterBindConstraint.html" title="ClutterBindConstraint"><span class="type">ClutterBindConstraint</span></a>
</td>
</tr>
<tr>
<td><p><span class="term"><span class="emphasis"><em>Returns</em></span> :</span></p></td>
<td>the offset, in pixels</td>
</tr>
</tbody>
</table></div>
<p class="since">Since 1.4</p>
</div>
</div>
<div class="refsect1">
<a name="ClutterBindConstraint.property-details"></a><h2>Property Details</h2>
<div class="refsect2">
<a name="ClutterBindConstraint--coordinate"></a><h3>The <code class="literal">"coordinate"</code> property</h3>
<pre class="programlisting">  "coordinate"               <a class="link" href="ClutterBindConstraint.html#ClutterBindCoordinate" title="enum ClutterBindCoordinate"><span class="type">ClutterBindCoordinate</span></a>  : Read / Write / Construct</pre>
<p>
The coordinate to be bound
</p>
<p>Default value: CLUTTER_BIND_X</p>
<p class="since">Since 1.4</p>
</div>
<hr>
<div class="refsect2">
<a name="ClutterBindConstraint--offset"></a><h3>The <code class="literal">"offset"</code> property</h3>
<pre class="programlisting">  "offset"                   <span class="type">gfloat</span>                : Read / Write / Construct</pre>
<p>
The offset, in pixels, to be applied to the binding
</p>
<p>Default value: 0</p>
<p class="since">Since 1.4</p>
</div>
<hr>
<div class="refsect2">
<a name="ClutterBindConstraint--source"></a><h3>The <code class="literal">"source"</code> property</h3>
<pre class="programlisting">  "source"                   <a class="link" href="ClutterActor.html" title="ClutterActor"><span class="type">ClutterActor</span></a>*         : Read / Write / Construct</pre>
<p>
The <a class="link" href="ClutterActor.html" title="ClutterActor"><span class="type">ClutterActor</span></a> used as the source for the binding.
</p>
<p>
The <a class="link" href="ClutterActor.html" title="ClutterActor"><span class="type">ClutterActor</span></a> must not be contained inside the actor associated
to the constraint.
</p>
<p class="since">Since 1.4</p>
</div>
</div>
</div>
<div class="footer">
<hr>
          Generated by GTK-Doc V1.18.1</div>
</body>
</html>