ANIMATOR : Fixed bug timeline tree 82/18682/1
authorjinwooim.bae <jinwooim.bae@samsung.com>
Fri, 28 Mar 2014 05:41:20 +0000 (14:41 +0900)
committerjinwooim.bae <jinwooim.bae@samsung.com>
Fri, 28 Mar 2014 05:41:20 +0000 (14:41 +0900)
This bug is about timeline tree selection, tree expand, tree collapse.

Change-Id: I6240fca399205feba82519cbcd94ce80f0084be8
Signed-off-by: jinwooim.bae <jinwooim.bae@samsung.com>
org.tizen.webuibuilder/src/org/tizen/webuibuilder/animator/ui/views/timeline/TimelineContentContainer.java
org.tizen.webuibuilder/src/org/tizen/webuibuilder/animator/ui/views/timeline/TimelineViewer.java
org.tizen.webuibuilder/src/org/tizen/webuibuilder/animator/ui/views/timeline/common/TimelineConstants.java
org.tizen.webuibuilder/src/org/tizen/webuibuilder/animator/ui/views/timeline/editpart/TimelineEditPart.java
org.tizen.webuibuilder/src/org/tizen/webuibuilder/animator/ui/views/timeline/header/TimelineContentHeaderContainer.java
org.tizen.webuibuilder/src/org/tizen/webuibuilder/animator/ui/views/timeline/tree/TimelineOutlineElement.java

index 2999cfb..d37604f 100644 (file)
@@ -55,6 +55,7 @@ import org.tizen.webuibuilder.animator.ui.views.timeline.header.TimelineOutlineH
 import org.tizen.webuibuilder.animator.ui.views.timeline.tool.TimelineContentToolsContainer;
 import org.tizen.webuibuilder.animator.ui.views.timeline.tree.TimeTreeElement;
 import org.tizen.webuibuilder.animator.utils.AnimatorUtils;
+import org.tizen.webuibuilder.utility.Platform;
 
 
 /**
@@ -148,10 +149,28 @@ public class TimelineContentContainer extends Composite {
 
                 contentTree.setRedraw(false);
 
-                viewer.getExpandColumn().setWidth(0);
-                viewer.getOutlineColumn().setWidth(sourceClientArea.width + 2);
-                viewer.getSeperatorColumn().setWidth(5);
-                viewer.getKeyframeColumn().setWidth(clientArea.width - sourceClientArea.width - 11);
+                int SEPERATOR_WIDTH = 0;
+                int OUTLINE_WIDTH = 0;
+                int EXPANDCOLUMN_WIDTH = 0;
+                if (Platform.getOS().equals(Platform.OS_WIN32)) {
+                    SEPERATOR_WIDTH = 5;
+                    OUTLINE_WIDTH = 2;
+                } else if (Platform.getOS().equals(Platform.OS_LINUX)) {
+                    SEPERATOR_WIDTH = 1;
+                    OUTLINE_WIDTH = 0;
+                    EXPANDCOLUMN_WIDTH = 1;
+                } else if (Platform.getOS().equals(Platform.OS_MACOSX)) {
+                    SEPERATOR_WIDTH = 5;
+                    OUTLINE_WIDTH = 2;
+                } else {
+                }
+
+                viewer.getExpandColumn().setWidth(EXPANDCOLUMN_WIDTH);
+                viewer.getOutlineColumn().setWidth(sourceClientArea.width + OUTLINE_WIDTH);
+                viewer.getSeperatorColumn().setWidth(SEPERATOR_WIDTH);
+                viewer.getKeyframeColumn()
+                        .setWidth(clientArea.width - sourceClientArea.width
+                                          - TimelineConstants.DEFAULT_SASH_SEPERATOR_MARGIN_WIDTH);
 
                 contentTree.setRedraw(true);
                 contentTree.redraw();
index 77d7163..60814db 100644 (file)
@@ -39,12 +39,15 @@ import org.eclipse.swt.SWT;
 import org.eclipse.swt.custom.TreeEditor;
 import org.eclipse.swt.widgets.Composite;
 import org.eclipse.swt.widgets.Control;
+import org.eclipse.swt.widgets.Event;
 import org.eclipse.swt.widgets.Label;
+import org.eclipse.swt.widgets.Listener;
 import org.eclipse.swt.widgets.Tree;
 import org.eclipse.swt.widgets.TreeColumn;
 import org.eclipse.swt.widgets.TreeItem;
 import org.eclipse.swt.widgets.Widget;
 import org.tizen.webuibuilder.BuilderConstants;
+import org.tizen.webuibuilder.animator.ui.views.timeline.common.TimelineConstants;
 import org.tizen.webuibuilder.animator.ui.views.timeline.editpart.TimelineEditPart;
 import org.tizen.webuibuilder.animator.ui.views.timeline.tree.TimeTreeElement;
 import org.tizen.webuibuilder.animator.ui.views.timeline.tree.TimelineOutlineElement;
@@ -52,6 +55,7 @@ import org.tizen.webuibuilder.animator.ui.views.timeline.widget.FrameWidget;
 import org.tizen.webuibuilder.animator.ui.views.timeline.widget.KeyFrameWidget;
 import org.tizen.webuibuilder.animator.ui.views.timeline.widget.LifeWidget;
 import org.tizen.webuibuilder.model.Part;
+import org.tizen.webuibuilder.utility.Platform;
 import org.tizen.webuibuilder.utility.ResourceManager;
 
 
@@ -100,29 +104,59 @@ public class TimelineViewer extends TreeViewer implements ISelectionChangedListe
                     contentTree.getClass().getDeclaredMethod("setItemHeight", int.class);
 
             setItemHeightMethod.setAccessible(true);
-            setItemHeightMethod.invoke(contentTree, 26);
+            setItemHeightMethod.invoke(contentTree, TimelineConstants.DEFAULT_TIMELINE_TREE_HEIGHT);
             setItemHeightMethod.setAccessible(false);
         } catch (Exception exception) {
-            exception.printStackTrace();
+            //exception.printStackTrace();
+            contentTree.addListener(SWT.MeasureItem, new Listener() {
+                
+                @Override
+                public void handleEvent(Event event) {
+                    //int clientHeight = contentTree.getClientArea().height;
+                    event.height = TimelineConstants.DEFAULT_TIMELINE_TREE_HEIGHT;
+                    
+                }
+            });
+            
         }
 
         expandColumn = new TreeColumn(contentTree, SWT.NONE);
-        contentTreeContainerColumnLayout.setColumnData(expandColumn, new ColumnPixelData(0, false,
-                                                                                         true));
-
         outlineColumn = new TreeColumn(contentTree, SWT.NONE);
-        contentTreeContainerColumnLayout.setColumnData(outlineColumn, new ColumnPixelData(217,
-                                                                                          false,
-                                                                                          true));
-
         seperatorColumn = new TreeColumn(contentTree, SWT.NONE);
-        contentTreeContainerColumnLayout.setColumnData(seperatorColumn, new ColumnPixelData(5,
-                                                                                            false,
-                                                                                            true));
-
         keyframeColumn = new TreeColumn(contentTree, SWT.NONE);
-        contentTreeContainerColumnLayout.setColumnData(keyframeColumn,
-                                                       new ColumnWeightData(100, 50));
+        parent.setLayout(contentTreeContainerColumnLayout);
+        
+        int SEPERATOR_WIDTH = 0;
+        int EXPANDCOLUMN_WIDTH = 0;
+        if (Platform.getOS().equals(Platform.OS_WIN32)) {
+            SEPERATOR_WIDTH = 5;
+        } else if (Platform.getOS().equals(Platform.OS_LINUX)) {
+            SEPERATOR_WIDTH = 1;
+            EXPANDCOLUMN_WIDTH = 1;
+        } else if (Platform.getOS().equals(Platform.OS_MACOSX)) {
+            SEPERATOR_WIDTH = 5;
+        } else {
+        }
+
+        contentTreeContainerColumnLayout.setColumnData(expandColumn,
+                                                       new ColumnPixelData(EXPANDCOLUMN_WIDTH,
+                                                                           false, true));
+
+        contentTreeContainerColumnLayout
+                .setColumnData(outlineColumn,
+                               new ColumnPixelData(
+                                                   TimelineConstants.DEFAULT_TREE_OUTLINECOLUMN_WIDTH,
+                                                   false, true));
+
+        contentTreeContainerColumnLayout.setColumnData(seperatorColumn,
+                                                       new ColumnPixelData(SEPERATOR_WIDTH, false,
+                                                                           true));
+
+        contentTreeContainerColumnLayout
+                .setColumnData(keyframeColumn,
+                               new ColumnWeightData(
+                                                    TimelineConstants.DEFAULT_TREE_KEYFRAMECOLUMN_WIDTH,
+                                                    TimelineConstants.DEFAULT_TREE_KEYFRAMECOLUMN_MIN_WIDTH));
 
         setControl(contentTree);
 
@@ -186,10 +220,12 @@ public class TimelineViewer extends TreeViewer implements ISelectionChangedListe
                     }
 
                     selectTreeItem(item, hasChildren);
-                    if (!item.getExpanded()) {
-                        expandTreeItem((Tree) getControl(), item, true);
-                    }
-
+                    
+                    boolean isExpanded = item.getExpanded();
+                    expandTreeItem((Tree) getControl(), item, !(isExpanded));
+                    ((Tree) getControl()).setSelection(item);
+                    ((Tree) getControl()).pack();
+                    
                     if (mainContainer != null) {
                         mainContainer.getContentContainer().showTreeItem(item);
                     }
@@ -216,68 +252,40 @@ public class TimelineViewer extends TreeViewer implements ISelectionChangedListe
      *            have to open is true, have to close is flase
      */
     public void expandTreeItem(Tree tree, TreeItem expandItem, boolean open) {
-        TreeItem[] items = tree.getItems();
-        for (TreeItem item : items) {
-            TreeEditor outlineEditor = (TreeEditor) item.getData("OutlineTreeEditor");
-            if (outlineEditor != null) {
-                if (item.equals(expandItem)) {
-                    item.setExpanded(open);
-
-                    TimelineOutlineElement outlineElement =
-                            (TimelineOutlineElement) outlineEditor.getEditor();
-                    if (open) {
-                        outlineElement.getTreeExpandArrow()
-                                .setImage(ResourceManager.getImage(BuilderConstants.ICON_DIR,
-                                                                   "animator_tree_expanded.png"));
-                    } else {
-                        outlineElement.getTreeExpandArrow()
-                                .setImage(ResourceManager.getImage(BuilderConstants.ICON_DIR,
-                                                                   "animator_tree_collapsed.png"));
-                    }
-
-                    outlineElement.getTreeExpandArrow().redraw();
-                    outlineElement.getWidgetIdOrSelector().pack();
-                }
 
-                if (item.getItems().length > 0) {
-                    expandTreeItem(item, open);
-                }
-
-                outlineEditor.layout();
-
-                TreeEditor keyframeEditor = (TreeEditor) item.getData("KeyframeTreeEditor");
-                keyframeEditor.layout();
+        expandItem.setExpanded(open);
+
+        TreeEditor outlineEditor = (TreeEditor) expandItem.getData("OutlineTreeEditor");
+        TimelineOutlineElement outlineElement = (TimelineOutlineElement) outlineEditor.getEditor();
+        if(outlineElement.getElementType() == 0) {
+            if (open) {
+                outlineElement.getTreeExpandArrow()
+                        .setImage(ResourceManager.getImage(BuilderConstants.ICON_DIR,
+                                                           "animator_tree_expanded.png"));
+            } else {
+                outlineElement.getTreeExpandArrow()
+                        .setImage(ResourceManager.getImage(BuilderConstants.ICON_DIR,
+                                                           "animator_tree_collapsed.png"));
             }
         }
-    }
 
-    /**
-     * Redraw expand TreeItem
-     * 
-     * @param expandItem
-     *            {@link TreeItem}
-     * @param open
-     *            have to open is true, have to close is flase
-     */
-    private void expandTreeItem(TreeItem expandItem, boolean open) {
-        int size = expandItem.getItemCount();
-
-        for (int i = 0; i < size; i++) {
-            TreeItem childItem = expandItem.getItems()[i];
-
-            TreeEditor outlineEditor = (TreeEditor) childItem.getData("OutlineTreeEditor");
-            if (outlineEditor != null) {
-                outlineEditor.layout();
-
-                TreeEditor keyframeEditor = (TreeEditor) childItem.getData("KeyframeTreeEditor");
-                keyframeEditor.layout();
-
-                TimeTreeElement element = (TimeTreeElement) childItem.getData("ReferentTreeWidget");
-                if (element != null) {
-                    element.redraw();
+        if (Platform.getOS().equals(Platform.OS_WIN32)) {
+            // nothing
+        } else if (Platform.getOS().equals(Platform.OS_LINUX)) {
+            if(outlineElement.getElementType() == 0) {
+                Event event = new Event();
+                event.item = expandItem;
+                if (open == true) {
+                    getControl().notifyListeners(SWT.Expand, event);
+                } else {
+                    getControl().notifyListeners(SWT.Collapse, event);
                 }
             }
+        } else if (Platform.getOS().equals(Platform.OS_MACOSX)) {
+            // nothing
+        } else {
         }
+
     }
 
     /**
index 36e93d9..a8ed20a 100644 (file)
@@ -61,5 +61,15 @@ public class TimelineConstants {
     public static final int DEFAULT_TIME_MILLISECOND = 100;
 
     public static final int DEFAULT_TIMEBAR_MARGINE = 30;
-
+    
+    public static final int DEFAULT_TIMELINE_SASH_WIDTH = 5;
+    public static final int DEFAULT_TREE_EXPANDCOLUMN_WIDTH = 1;
+    public static final int DEFAULT_TREE_OUTLINECOLUMN_WIDTH = 217;
+    public static final int DEFAULT_TREE_SEPERATORCOLUMN_WIDTH = 0;
+    public static final int DEFAULT_TREE_KEYFRAMECOLUMN_WIDTH = 100;
+    public static final int DEFAULT_TREE_KEYFRAMECOLUMN_MIN_WIDTH = 50;
+    
+    public static final int DEFAULT_SASH_SEPERATOR_MARGIN_WIDTH = 11;
+    
+    public static final int DEFAULT_TIMELINE_TREE_HEIGHT = 26;
 }
index 2905d68..7de70d9 100644 (file)
@@ -479,6 +479,17 @@ public class TimelineEditPart extends AbstractTreeEditPart {
         }
     }
 
+    /**
+     * Expand Collapse tree function
+     */
+    public void expandTree(TreeItem selectedItem) {
+        TreeItem lastSelectedTreeItem = viewer.getLastSelectedTreeItem();
+        if (lastSelectedTreeItem != null && lastSelectedTreeItem.equals(selectedItem)) {
+            boolean expanded = selectedItem.getExpanded();
+            viewer.expandTreeItem((Tree) viewer.getControl(), selectedItem, !(expanded));
+            
+        }
+    }
     /*****************************************************************************
      * Getter, Setter
      *****************************************************************************/
@@ -643,69 +654,23 @@ public class TimelineEditPart extends AbstractTreeEditPart {
             if (isLock()) {
 
             } else {
-
-                if (widget instanceof TimelineOutlineElement) {
+                if (widget instanceof TimelineOutlineElement
+                        || widget instanceof TimelineWidgetElement
+                        || widget instanceof TimeTreeElement) {
                     selectedItem = (TreeItem) widget.getData("RefrenceTreeItem");
 
-                    TreeItem lastSelectedTreeItem = viewer.getLastSelectedTreeItem();
-                    if (lastSelectedTreeItem != null && lastSelectedTreeItem.equals(selectedItem)) {
-                        boolean expanded = selectedItem.getExpanded();
-                        if (!expanded) {
-                            viewer.expandTreeItem((Tree) viewer.getControl(), selectedItem, true);
-                        } else {
-                            viewer.expandTreeItem((Tree) viewer.getControl(), selectedItem, false);
-                        }
-                    }
-                } else if (widget instanceof TimeTreeElement) {
-                    selectedItem = (TreeItem) widget.getData("RefrenceTreeItem");
-                } else if (widget instanceof TimelineWidgetElement) {
-                    selectedItem = (TreeItem) widget.getData("RefrenceTreeItem");
+                    expandTree(selectedItem);
 
-                    TreeItem lastSelectedTreeItem = viewer.getLastSelectedTreeItem();
-                    if (lastSelectedTreeItem != null && lastSelectedTreeItem.equals(selectedItem)) {
-                        boolean expanded = selectedItem.getExpanded();
-                        if (!expanded) {
-                            viewer.expandTreeItem((Tree) viewer.getControl(), selectedItem, true);
-                        } else {
-                            viewer.expandTreeItem((Tree) viewer.getControl(), selectedItem, false);
-                        }
-                    }
                 } else if (widget instanceof Label) {
                     selectedItem =
                             (TreeItem) ((Label) widget).getParent().getData("RefrenceTreeItem");
 
-                    if (((Label) widget).getParent() instanceof TimelineOutlineElement) {
-                        Label label = (Label) widget;
-                        Object data = label.getData();
-                        if (data != null && data.equals("Expand Arrow")) {
-                            boolean expanded = selectedItem.getExpanded();
-                            if (!expanded) {
-                                viewer.expandTreeItem((Tree) viewer.getControl(), selectedItem,
-                                                      true);
-                            } else {
-                                viewer.expandTreeItem((Tree) viewer.getControl(), selectedItem,
-                                                      false);
-                            }
-
-                            selectedItem.getParent().select(selectedItem);
+                    expandTree(selectedItem);
 
-                            return;
-                        }
-                    }
-
-                    TreeItem lastSelectedTreeItem = viewer.getLastSelectedTreeItem();
-                    if (lastSelectedTreeItem != null && lastSelectedTreeItem.equals(selectedItem)) {
-                        boolean expanded = selectedItem.getExpanded();
-                        if (!expanded) {
-                            viewer.expandTreeItem((Tree) viewer.getControl(), selectedItem, true);
-                        } else {
-                            viewer.expandTreeItem((Tree) viewer.getControl(), selectedItem, false);
-                        }
-                    }
                 } else if (widget instanceof Button) {
                     selectedItem =
                             (TreeItem) ((Button) widget).getParent().getData("RefrenceTreeItem");
-                } else if (widget instanceof LifeWidget) {
+                } else if (widget instanceof LifeWidget || widget instanceof FrameWidget) {
                     Control lastSelectedKeyframeWidget = viewer.getLastSelectedKeyframeWidget();
                     if (lastSelectedKeyframeWidget != null) {
                         if (lastSelectedKeyframeWidget instanceof LifeWidget) {
@@ -716,54 +681,41 @@ public class TimelineEditPart extends AbstractTreeEditPart {
                     }
 
                     viewer.setLastSelectedKeyframeWidget((Control) widget);
-                    ((LifeWidget) widget).redraw();
 
-                    KeyFrameWidget keyframeWidget =
-                            (KeyFrameWidget) ((LifeWidget) widget).getParent();
-                    TimeTreeElement treeElement = (TimeTreeElement) keyframeWidget.getParent();
-
-                    selectedItem = (TreeItem) treeElement.getData("RefrenceTreeItem");
-
-                    moveOnTopSelectedKeyframeWidget(keyframeWidget);
-                } else if (widget instanceof FrameWidget) {
-                    Control lastSelectedKeyframeWidget = viewer.getLastSelectedKeyframeWidget();
-                    if (lastSelectedKeyframeWidget != null) {
-                        if (lastSelectedKeyframeWidget instanceof LifeWidget) {
-                            ((LifeWidget) lastSelectedKeyframeWidget).redraw();
-                        } else {
-                            model = ((FrameWidget) lastSelectedKeyframeWidget).getModel();
-                            ((FrameWidget) lastSelectedKeyframeWidget).redraw();
-                        }
+                    if (widget instanceof LifeWidget) {
+                        ((LifeWidget) widget).redraw();
+                        KeyFrameWidget keyframeWidget =
+                                (KeyFrameWidget) ((LifeWidget) widget).getParent();
+                        TimeTreeElement treeElement = (TimeTreeElement) keyframeWidget.getParent();
+                        selectedItem = (TreeItem) treeElement.getData("RefrenceTreeItem");
+                        moveOnTopSelectedKeyframeWidget(keyframeWidget);
+                    } else {
+                        ((FrameWidget) widget).redraw();
+                        KeyFrameWidget keyframeWidget =
+                                (KeyFrameWidget) ((FrameWidget) widget).getParent().getParent();
+                        TimeTreeElement treeElement = (TimeTreeElement) keyframeWidget.getParent();
+                        selectedItem = (TreeItem) treeElement.getData("RefrenceTreeItem");
+                        moveOnTopSelectedKeyframeWidget(keyframeWidget);
                     }
 
-                    viewer.setLastSelectedKeyframeWidget((Control) widget);
-                    ((FrameWidget) widget).redraw();
-
-                    KeyFrameWidget keyframeWidget =
-                            (KeyFrameWidget) ((FrameWidget) widget).getParent().getParent();
-
-                    TimeTreeElement treeElement = (TimeTreeElement) keyframeWidget.getParent();
-
-                    selectedItem = (TreeItem) treeElement.getData("RefrenceTreeItem");
-
-                    moveOnTopSelectedKeyframeWidget(keyframeWidget);
                 }
-
-                AnimatorModelManager manager =
-                        AnimatorModelManager.getInstance(AnimatorUtils.getAppManager());
-
-                manager.fireEvent(AnimatorModelEvent.EventType.SELECTION_CHANGE,
-                                  AnimatorModelEvent.Origin.TIMELINE, model);
-
                 if (selectedItem != null) {
                     ScrolledComposite treeContainer =
                             (ScrolledComposite) viewer.getControl().getParent();
                     treeContainer.setFocus();
 
                     Tree contentTree = (Tree) viewer.getControl();
+                    contentTree.setSelection(selectedItem);
                     contentTree.select(selectedItem);
+                    contentTree.pack();
 
                     viewer.select(TimelineEditPart.this);
+
+                    AnimatorModelManager manager =
+                         AnimatorModelManager.getInstance(AnimatorUtils.getAppManager());
+                    manager.fireEvent(AnimatorModelEvent.EventType.SELECTION_CHANGE,
+                                      AnimatorModelEvent.Origin.TIMELINE, model);
+
                 }
             }
         }
index 6cf52f5..6771a3a 100644 (file)
@@ -36,6 +36,7 @@ import org.eclipse.swt.layout.FormData;
 import org.eclipse.swt.layout.FormLayout;
 import org.eclipse.swt.widgets.Composite;
 import org.eclipse.swt.widgets.Sash;
+import org.tizen.webuibuilder.animator.ui.views.timeline.common.TimelineConstants;
 
 
 /**
@@ -79,7 +80,7 @@ public class TimelineContentHeaderContainer extends Composite {
 
         // Content Header SashForm
         contentHeadersashForm = new SashForm(this, SWT.NONE);
-        contentHeadersashForm.SASH_WIDTH = 5;
+        contentHeadersashForm.SASH_WIDTH = TimelineConstants.DEFAULT_TIMELINE_SASH_WIDTH;
         contentHeadersashForm.setData("CompositeName", "contentHeadersashForm");
 
         FormData contentHeadersashFormData = new FormData();
index b9cdc27..25f692e 100644 (file)
@@ -63,7 +63,6 @@ import org.tizen.webuibuilder.animator.ui.views.timeline.command.TimelineFrameCr
 import org.tizen.webuibuilder.animator.ui.views.timeline.common.ColorResource;
 import org.tizen.webuibuilder.animator.ui.views.timeline.editpart.TimelineEditPart;
 import org.tizen.webuibuilder.animator.utils.AnimatorUtils;
-import org.tizen.webuibuilder.model.Part;
 import org.tizen.webuibuilder.model.descriptors.PartDescriptor;
 import org.tizen.webuibuilder.utility.ResourceManager;
 
@@ -123,7 +122,7 @@ public class TimelineOutlineElement extends Composite {
         this.treeItem = treeItem;
         this.setModel(model);
         this.editpart = editpart;
-        this.elementType = elementType;
+        this.setElementType(elementType);
 
         AnimatorModelManager manager =
                 AnimatorModelManager.getInstance(AnimatorUtils.getAppManager());
@@ -142,7 +141,8 @@ public class TimelineOutlineElement extends Composite {
             setBackground(ColorResource.PARENT_TREEITEM);
             animatorModelOutlineAdapter = new AnimatorModelOutlineAdapter();
 
-            ((AnimatorPart)manager.getRootPart()).addAnimatorModelListener(animatorModelOutlineAdapter);
+            ((AnimatorPart) manager.getRootPart())
+                    .addAnimatorModelListener(animatorModelOutlineAdapter);
 
         } else {
             this.setBackground(ColorResource.CHILD_TREEITEM);
@@ -159,7 +159,7 @@ public class TimelineOutlineElement extends Composite {
                 e.gc.setForeground(ColorResource.TREEITEM_BORDER);
 
                 if (islock) {
-                    if (TimelineOutlineElement.this.elementType == 0) {
+                    if (TimelineOutlineElement.this.getElementType() == 0) {
                         setBackground(ColorResource.PARENT_TREEITEM_LOCKED);
                     } else {
                         setBackground(ColorResource.CHILD_TREEITEM_LOCKED);
@@ -167,14 +167,14 @@ public class TimelineOutlineElement extends Composite {
 
                 } else if (isSelected) {
 
-                    if (TimelineOutlineElement.this.elementType == 0) {
+                    if (TimelineOutlineElement.this.getElementType() == 0) {
                         setBackground(ColorResource.PARENT_TREEITEM_SELECTED);
                     } else {
                         setBackground(ColorResource.CHILD_TREEITEM_SELECTED);
                     }
 
                 } else {
-                    if (TimelineOutlineElement.this.elementType == 0) {
+                    if (TimelineOutlineElement.this.getElementType() == 0) {
                         Color foreground = e.gc.getForeground();
 
                         e.gc.setBackground(ColorResource.PARENT_TREEITEM_BACKGROUND);
@@ -199,7 +199,8 @@ public class TimelineOutlineElement extends Composite {
 
                 AnimatorModelManager manager =
                         AnimatorModelManager.getInstance(AnimatorUtils.getAppManager());
-                ((AnimatorPart)manager.getRootPart()).removeAnimatorModelListener(animatorModelOutlineAdapter);
+                ((AnimatorPart) manager.getRootPart())
+                        .removeAnimatorModelListener(animatorModelOutlineAdapter);
             }
         });
     }
@@ -221,7 +222,7 @@ public class TimelineOutlineElement extends Composite {
     private void createControls() {
         this.setLayout(new FormLayout());
 
-        if (elementType == 0) {
+        if (getElementType() == 0) {
             treeExpandArrow = new Label(this, SWT.NONE);
             treeExpandArrow.setData("Expand Arrow");
             treeExpandArrow.setBackground(ColorResource.PARENT_TREEITEM);
@@ -231,15 +232,18 @@ public class TimelineOutlineElement extends Composite {
             FormData treeExpandArrowFormData = new FormData();
             treeExpandArrowFormData.top = new FormAttachment(0, 9);
             treeExpandArrowFormData.left = new FormAttachment(0, 5);
+            treeExpandArrowFormData.width = 7;
+            treeExpandArrowFormData.height = 7;
             treeExpandArrow.setLayoutData(treeExpandArrowFormData);
-            treeExpandArrow.setText("");
             treeExpandArrow.addPaintListener(timelineOutlinePaintListener);
+            treeExpandArrow.pack();
 
             widgetIcon = new Label(this, SWT.NONE);
             widgetIcon.setData("Widget Icon");
             widgetIcon.setBackground(ColorResource.PARENT_TREEITEM);
 
-            AnimatorWidgetPart widgetPart = (AnimatorWidgetPart) ((AnimatorWidget) getModel()).getPartLink();
+            AnimatorWidgetPart widgetPart =
+                    (AnimatorWidgetPart) ((AnimatorWidget) getModel()).getPartLink();
             if (widgetPart != null) {
                 PartDescriptor partDescriptor = widgetPart.getPartDescriptor();
                 widgetIconFile = partDescriptor.getIcon16();
@@ -250,18 +254,20 @@ public class TimelineOutlineElement extends Composite {
                                                              widgetIconFile));
 
                 FormData widgetIconFormData = new FormData();
-                widgetIconFormData.top = new FormAttachment(0, 5);
+                widgetIconFormData.top = new FormAttachment(0, 3);
                 widgetIconFormData.left = new FormAttachment(0, 16);
+                widgetIconFormData.width = 16;
+                widgetIconFormData.height = 16;
                 widgetIcon.setLayoutData(widgetIconFormData);
-                widgetIcon.setText("");
                 widgetIcon.addPaintListener(timelineOutlinePaintListener);
             }
+            widgetIcon.pack();
         }
 
         widgetIdOrSelector = new Label(this, SWT.NONE);
         FormData widgetIdOrSelectorFormData = new FormData();
         widgetIdOrSelectorFormData.top = new FormAttachment(0, 4);
-        if (elementType == 0) {
+        if (getElementType() == 0) {
             widgetIdOrSelector.setBackground(ColorResource.PARENT_TREEITEM);
             widgetIdOrSelectorFormData.left = new FormAttachment(0, 39);
         } else {
@@ -271,8 +277,9 @@ public class TimelineOutlineElement extends Composite {
         widgetIdOrSelector.setLayoutData(widgetIdOrSelectorFormData);
         widgetIdOrSelector.setText("Widget Or Selector");
         widgetIdOrSelector.addPaintListener(timelineOutlinePaintListener);
+        widgetIdOrSelector.pack();
 
-        if (elementType == 0) {
+        if (getElementType() == 0) {
             lockableButton = new Label(this, SWT.TRANSPARENT);
             lockableButton.setData("Lock");
             lockableButton.setBackground(ColorResource.PARENT_TREEITEM);
@@ -286,11 +293,13 @@ public class TimelineOutlineElement extends Composite {
 
             FormData lockableButtonFormData = new FormData();
             lockableButtonFormData.top = new FormAttachment(0, 4);
-            lockableButtonFormData.right = new FormAttachment(100, -51);
+            lockableButtonFormData.right = new FormAttachment(100, -27);
             lockableButtonFormData.width = 16;
             lockableButtonFormData.height = 16;
             lockableButton.setLayoutData(lockableButtonFormData);
             lockableButton.addPaintListener(timelineOutlinePaintListener);
+            lockableButton.pack();
+            lockableButton.moveAbove(widgetIdOrSelector);
 
             lockableButton.addMouseListener(new MouseAdapter() {
                 @Override
@@ -336,11 +345,13 @@ public class TimelineOutlineElement extends Composite {
 
             FormData visibleButtonFormData = new FormData();
             visibleButtonFormData.top = new FormAttachment(0, 4);
-            visibleButtonFormData.right = new FormAttachment(100, -27);
+            visibleButtonFormData.right = new FormAttachment(100, -4);
             visibleButtonFormData.width = 16;
             visibleButtonFormData.height = 16;
             visibleButton.setLayoutData(visibleButtonFormData);
             visibleButton.addPaintListener(timelineOutlinePaintListener);
+            visibleButton.pack();
+            visibleButton.moveAbove(widgetIdOrSelector);
 
             visibleButton.addMouseListener(new MouseAdapter() {
                 @Override
@@ -391,6 +402,7 @@ public class TimelineOutlineElement extends Composite {
             addFrameButtonFormData.height = 16;
             addFrameButton.setLayoutData(addFrameButtonFormData);
             addFrameButton.addPaintListener(timelineOutlinePaintListener);
+            addFrameButton.pack();
 
             addFrameButton.addMouseListener(new MouseAdapter() {
                 @Override
@@ -459,6 +471,7 @@ public class TimelineOutlineElement extends Composite {
                 }
             });
         }
+        redraw();
     }
 
     /*****************************************************************************
@@ -697,6 +710,14 @@ public class TimelineOutlineElement extends Composite {
         this.model = model;
     }
 
+    public int getElementType() {
+        return elementType;
+    }
+
+    public void setElementType(int elementType) {
+        this.elementType = elementType;
+    }
+
     /**********************************************************************************************
      * PaintListener to Child Label
      **********************************************************************************************/
@@ -709,25 +730,25 @@ public class TimelineOutlineElement extends Composite {
 
             Rectangle parentClientArea = label.getParent().getClientArea();
 
-            boolean isLock = TimelineOutlineElement.this.editpart.isLock();
-            boolean isSelected = TimelineOutlineElement.this.editpart.isSelected();
+            boolean isLock = editpart.isLock();
+            boolean isSelected = editpart.isSelected();
 
             if (isLock) {
-                if (TimelineOutlineElement.this.elementType == 0) {
+                if (TimelineOutlineElement.this.getElementType() == 0) {
                     label.setBackground(ColorResource.PARENT_TREEITEM_LOCKED);
                 } else {
                     label.setBackground(ColorResource.CHILD_TREEITEM_LOCKED);
                 }
 
             } else if (isSelected) {
-                if (TimelineOutlineElement.this.elementType == 0) {
+                if (TimelineOutlineElement.this.getElementType() == 0) {
                     label.setBackground(ColorResource.PARENT_TREEITEM_SELECTED);
                 } else {
                     label.setBackground(ColorResource.CHILD_TREEITEM_SELECTED);
                 }
 
             } else {
-                if (TimelineOutlineElement.this.elementType == 0) {
+                if (TimelineOutlineElement.this.getElementType() == 0) {
                     drawGradiantWidget(label, e.gc, parentClientArea);
                 } else {
                     label.setBackground(ColorResource.CHILD_TREEITEM);
@@ -813,7 +834,7 @@ public class TimelineOutlineElement extends Composite {
      * Draw children widget
      */
     private void childredraw() {
-        if (TimelineOutlineElement.this.elementType == 0) {
+        if (TimelineOutlineElement.this.getElementType() == 0) {
             treeExpandArrow.redraw();
             widgetIcon.redraw();
             widgetIdOrSelector.redraw();