Skip to content
This repository has been archived by the owner on Oct 14, 2019. It is now read-only.

Commit

Permalink
FileOpenPopup usability updates
Browse files Browse the repository at this point in the history
  • Loading branch information
ianharrigan committed May 3, 2013
1 parent 2662aee commit 8294762
Show file tree
Hide file tree
Showing 6 changed files with 127 additions and 24 deletions.
60 changes: 60 additions & 0 deletions assets/skins/android/popups.css
Original file line number Diff line number Diff line change
Expand Up @@ -122,3 +122,63 @@ BusyPopup #popupContent {
paddingRight: 5;
paddingBottom: 8;
}


FileOpenPopup {
backgroundImage: skins/android/popup/popup_border.png;
backgroundImageScale9: 4,50,258,86;
width: 430;
hieght: 250;
}

FileOpenPopup #popupTitle {
paddingLeft: 5;
paddingTop: 10;
paddingRight: 0;
paddingBottom: 0;
fontSize: 26;
color: 0xFFFFFF;
}

FileOpenPopup #popupContent {
paddingLeft: 2;
paddingTop: 50;
paddingRight: 2;
paddingBottom: 2;
}

FileOpenPopup ListView {
backgroundImage: null;
innerScrolls: true;
}

FileOpenPopup ListViewItem {
backgroundImage: skins/android/list/list_item_popup_unselected.png;
paddingLeft: 0;
paddingTop: 12;
paddingRight: 12;
paddingBottom: 12;
}

FileOpenPopup ListViewItem:selected {
backgroundImage: skins/android/list/list_item_selected.png;
}

FileOpenPopup ListViewItem Label {
fontSize: 22;
fontName: _sans;
color: 0x000000;
}

FileOpenPopup ListViewItem Label:selected {
fontSize: 22;
fontName: _sans;
color: 0xFFFFFF;
}

FileOpenPopup #popupContent HBox {
paddingLeft: 2;
paddingTop: 2;
paddingBottom: 2;
paddingRight: 2;
}
11 changes: 8 additions & 3 deletions assets/skins/gradient/gradient.css
Original file line number Diff line number Diff line change
Expand Up @@ -292,15 +292,15 @@ TextInput {
cornerRadius: 2;
}

SimplePopup, ListPopup, CustomPopup, BusyPopup {
SimplePopup, ListPopup, CustomPopup, BusyPopup, FileOpenPopup {
backgroundColor: 0xa5b8da;
borderColor: 0x7d99ca;
cornerRadius: 3;
borderSize: 1;
width: 230;
}

SimplePopup #popupTitle, ListPopup #popupTitle, CustomPopup #popupTitle {
SimplePopup #popupTitle, ListPopup #popupTitle, CustomPopup #popupTitle, FileOpenPopup #popupTitle {
paddingLeft: 5;
paddingTop: 5;
paddingRight: 0;
Expand All @@ -310,7 +310,7 @@ SimplePopup #popupTitle, ListPopup #popupTitle, CustomPopup #popupTitle {
fontName: _sans;
}

SimplePopup #popupContent, ListPopup #popupContent, CustomPopup #popupContent {
SimplePopup #popupContent, ListPopup #popupContent, CustomPopup #popupContent, FileOpenPopup #popupContent {
paddingLeft: 10;
paddingTop: 32;
paddingRight: 10;
Expand All @@ -330,6 +330,11 @@ BusyPopup #popupContent {
fontName: _sans;
}

FileOpenPopup {
width: 430;
hieght: 250;
}

SimplePopup #popupContent Label, BusyPopup #popupContent Label {
color: 0x495267;
fontSize: 13;
Expand Down
16 changes: 16 additions & 0 deletions assets/skins/windows/popups.css
Original file line number Diff line number Diff line change
Expand Up @@ -88,6 +88,22 @@ FileOpenPopup #popupContent {
paddingBottom: 10;
}

FileOpenPopup #pathControl Button {
backgroundImage: embedded://skins/windows/tab.png;
backgroundImageScale9: 5,5,15,15;
backgroundImageRect: 20, 0, 20, 20;
paddingLeft: 5;
paddingTop: 5;
paddingBottom: 5;
paddingRight: 5;
}

FileOpenPopup #pathControl Button:over {
backgroundImage: embedded://skins/windows/tab.png;
backgroundImageScale9: 5,5,15,15;
backgroundImageRect: 40, 0, 20, 20;
}

FileOpenPopup #dir {
icon: icons/folder_open_16.png;
}
Expand Down
Binary file modified docs/screenshots/main.jpg
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
8 changes: 7 additions & 1 deletion src/haxe/ui/core/Component.hx
Original file line number Diff line number Diff line change
Expand Up @@ -278,6 +278,7 @@ class Component implements IEventDispatcher {
}
childrenToAdd = null;
}

calcSize();
layout.repositionChildren();

Expand Down Expand Up @@ -549,14 +550,19 @@ class Component implements IEventDispatcher {
}

if (Std.is(c, Component)) {
childComponents.remove(c);
var b:Bool = childComponents.remove(c);
if (childrenToAdd != null) {
childrenToAdd.remove(c);
}
c = untyped c.sprite;

}

var r:Dynamic = null;
r = sprite.removeChild(c);
calcSize();
layout.repositionChildren();

return r;
}

Expand Down
56 changes: 36 additions & 20 deletions src/haxe/ui/extension/files/FileOpenPopup.hx
Original file line number Diff line number Diff line change
Expand Up @@ -21,11 +21,12 @@ class FileOpenPopup extends Popup {
private var selectButton:Button;
private var cancelButton:Button;
private var upButton:Button;
private var currentDirLabel:Label;
public var fnCallback:Dynamic->Void;

private var currentDir:String;

private var pathBox:HBox;

public function new(dir:String = null) {
super();
title = "Select File";
Expand Down Expand Up @@ -60,29 +61,16 @@ class FileOpenPopup extends Popup {

#if !(flash)
{
var hbox:HBox = new HBox();
hbox.percentWidth = 100;

upButton = new Button();
upButton.text = "Up";
upButton.addEventListener(MouseEvent.CLICK, onUp);
hbox.addChild(upButton);

var label:Label = new Label();
label.text = "Current Dir:";
label.verticalAlign = "center";
hbox.addChild(label);
pathBox = new HBox();
pathBox.percentWidth = 100;
pathBox.id = "pathControl";

currentDirLabel = new Label();
currentDirLabel.text = currentDir;
currentDirLabel.verticalAlign = "center";
hbox.addChild(currentDirLabel);

vbox.addChild(hbox);
vbox.addChild(pathBox);
}

{
fileList = new ListView();
fileList.id = "list";
fileList.percentWidth = fileList.percentHeight = 100;
vbox.addChild(fileList);
fileList.addEventListener(Event.CHANGE, function (e:Event) {
Expand Down Expand Up @@ -142,7 +130,6 @@ class FileOpenPopup extends Popup {
} while (fileList.dataSource.moveFirst());
}

currentDirLabel.text = currentDir;
if (isDir(currentDir)) {
var files:Array<String> = FileSystem.readDirectory(currentDir);

Expand All @@ -168,9 +155,11 @@ class FileOpenPopup extends Popup {
fileList.vscrollPosition = 0;

//fileList.enabled = true; // TODO: problem with reenabling list items, events lost
refreshPathUI();
#end
}

/*
private function onUp(event:MouseEvent):Void {
var arr:Array<String> = currentDir.split("/");
var s:String = arr.pop();
Expand All @@ -183,6 +172,7 @@ class FileOpenPopup extends Popup {
currentDir = fixDir(newPath);
refreshList();
}
*/

private function onOpen(event:MouseEvent):Void {
#if !(flash)
Expand Down Expand Up @@ -260,6 +250,32 @@ class FileOpenPopup extends Popup {
return s;
}

private function refreshPathUI():Void {
while (pathBox.getNumChildren() > 0) {
pathBox.removeChild(pathBox.listChildComponents()[0]); // TODO: ugly
}

var paths:Array<String> = currentDir.split("/");
var fullPath:String = "";
for (path in paths) {
fullPath += path + "/";

var button:Button = new Button();
button.text = path;
pathBox.addChild(button);
button.addEventListener(MouseEvent.CLICK, buildPathClickFunction(fullPath));
}
}

public function buildPathClickFunction(path:String) {
return function(event:MouseEvent) { setPath(path); };
}

private function setPath(path:String):Void {
currentDir = fixDir(path);
refreshList();
}

public static function show(root:Root, dir:String = null, fnCallback:Dynamic->Void = null):FileOpenPopup {
var popup:FileOpenPopup = new FileOpenPopup(dir);
popup.fnCallback = fnCallback;
Expand Down

2 comments on commit 8294762

@cambiata
Copy link

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Happy to see FileOpenPopup! 👍

@ianharrigan
Copy link
Owner Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Hey Cam,

Thanks! Im now going through the motions and trying to work out what controls i want before i move over to a new repo. Ive decided to rewrite (kind of) the whole thing (mainly the component system and the style system), so now im really just working what i want to add in the new version and if its feasable. Basically haxeui as a PoC. If you can think of any controls (or features) then let me know and ill have a think about them, working on better keyboard and tabbing support at the moment (and then a gridview/tableview).

Anyways, cheers!

Ian

Please sign in to comment.