 ログイン
 メインメニュー
|
投稿者 |
スレッド |
yamafumi |
Åê¹ÆNo.35790 投稿日時: 2007-10-24 17:17 |
新米   居住地: 投稿: 13
使用環境: WinXP,FlashCS3
|
DataGrid上のチェックボックスやボタンが表示されない いつもお世話になっています。 AS3.0でDatGridコンポーネントを使用しています。 グリッド上にチェクボックスやボタンを配置したいと考えています。 AS2.0でのサンプルなどからCellRendererを使用するというところ まではわかったのですが、当然ながらAS3.0では記述の仕方が 同じではないようで、悩んでいます。
ヘルプの「カスタムCellRendererクラスの定義・・・ライブラリシンボルを使用して・・・」 を参考に見よう見まねでチェックボックス、ボタンを配置してみたの ですが、私の書いたコードでは初期状態ではチェクボックスもボタンも 表示されず、マウスオーバーのタイミングで初めてチェックボックスが 表示されるというような動きになってしまいます。
まずは、画面表示からでもクリアしていきたいと考えています。 どなたか助言いただけないでしょうか?
・・・・フレーム側のコード(ここから)・・・・・ import fl.data.DataProvider; import fl.controls.*; import fl.controls.dataGridClasses.*; var gobjDp:DataProvider = new DataProvider(); var grdChk:DataGridColumn = new DataGridColumn("Chk"); var grdBtn:DataGridColumn = new DataGridColumn("Btn"); //列の定義 grdChk.headerText = "チェック列"; grdBtn.headerText = "ボタン列"; grdChk.cellRenderer = chkCellRenderer; grdBtn.cellRenderer = btnCellRenderer;
grdChk.width = 100; grdBtn.width = 100; //
grdSample.addColumn(grdChk); grdSample.addColumn(grdBtn);
//データのセット gobjDp.addItem({Chk:true,Btn:"Push"}); gobjDp.addItem({Chk:true,Btn:"Push"}); gobjDp.addItem({Chk:true,Btn:"Push"});
grdSample.dataProvider = gobjDp; ・・・・フレーム側のコード(ここまで)・・・・・
・・・・チェックボックスCellRendererのコード(ここから)・・・・・ package { import flash.display.MovieClip; import fl.controls.listClasses.ICellRenderer; import fl.controls.listClasses.ListData; public class chkCellRenderer extends MovieClip implements ICellRenderer { private var _listData:ListData; private var _data:Object; private var _selected:Boolean; public function chkCellRenderer() { } public function set data(d:Object):void { _data = d; } public function get data():Object { return _data; } public function set listData(ld:ListData):void { _listData = ld; } public function get listData():ListData { return _listData; } public function set selected(s:Boolean):void { _selected = s; } public function get selected():Boolean { return _selected; } public function setSize(width:Number, height:Number):void { } public function setStyle(style:String, value:Object):void { } public function setMouseState(state:String):void { } } } ・・・・チェックボックスCellRendererのコード(ここまで)・・・・・
・・・・ボタンCellRendererのコード(ここから)・・・・・ package { import flash.display.MovieClip; import fl.controls.listClasses.ICellRenderer; import fl.controls.listClasses.ListData; import flash.utils.setInterval; public class btnCellRenderer extends MovieClip implements ICellRenderer { private var _listData:ListData; private var _data:Object; private var _selected:Boolean; public function btnCellRenderer() { } public function set data(d:Object):void { _data = d; } public function get data():Object { return _data; } public function set listData(ld:ListData):void { _listData = ld; } public function get listData():ListData { return _listData; } public function set selected(s:Boolean):void { _selected = s; } public function get selected():Boolean { return _selected; } public function setSize(width:Number, height:Number):void { } public function setStyle(style:String, value:Object):void { } public function setMouseState(state:String):void { } } } ・・・・ボタンCellRendererのコード(ここまで)・・・・・
|
|
|
yamafumi |
Åê¹ÆNo.35847 投稿日時: 2007-10-29 10:27 |
新米   居住地: 投稿: 13
使用環境: WinXP,FlashCS3
|
Re: DataGrid上のチェックボックスやボタンが表示されない 自己レスです。 以下のようにスクリプトを修正することによって、グリッド上に チェックボックスとボタンは表示されるようになりました。
ただし、チェックボックスやボタンがマウスに反応しなく、 相変わらず困っています。どなたか、ご教授いただけないでしょうか? 以下、コード(ステージにはDataGird配置。ライブラリにはチェックボックスとボタンを追加) ・・・・フレーム側のコード(ここから)・・・・・ import fl.data.DataProvider; import fl.controls.*; import fl.controls.dataGridClasses.*;
var gobjDp:DataProvider = new DataProvider(); var grdChk:DataGridColumn = new DataGridColumn("Chk"); var grdBtn:DataGridColumn = new DataGridColumn("Btn"); //列の定義 grdChk.headerText = "チェック列"; grdBtn.headerText = "ボタン列"; grdChk.width = 30; grdBtn.width = 50;
//セルレンダラーを定義 grdChk.cellRenderer = checkboxCell; grdBtn.cellRenderer = buttonCell;
grdSample.addColumn(grdChk); grdSample.addColumn(grdBtn);
//データのセット var lstrHideText:String = "確認しました。10/23"; gobjDp.addItem({Chk:"@CheckBox",Btn:"Line1="+lstrHideText}); gobjDp.addItem({Chk:"",Btn:"@Button",BtnHideLabel:""}); gobjDp.addItem({Chk:"@CheckBox",Btn:"Line3="+lstrHideText});
grdSample.dataProvider = gobjDp; ・・・・フレーム側のコード(ここまで)・・・・・
・・・・チェックボックスCellRendererのコード(ここから)・・・・・ package { import fl.core.UIComponent; import fl.controls.CheckBox; import fl.controls.listClasses.ICellRenderer; import fl.controls.listClasses.CellRenderer; import fl.controls.listClasses.ListData; public class checkboxCell extends CellRenderer { private var mchkDel:CheckBox;
public function checkboxCell() { mchkDel = new CheckBox(); mchkDel.setSize(50,22); mchkDel.label=""; addChild(mchkDel); mchkDel.drawNow(); }
override public function set listData(ld:ListData):void { var lobjNewList:ListData; //データプロパイダーのaddItem時にセットされたラベルの内容で //チェックボックスの表示・非表示を制御。ただし、このままでは //チェックボックスの背景にld.labelで設定された文字列がそのまま表示 //されてしまうため、新しいListDataオブジェクトを作り、ラベルのみクリアして //基本クラスに渡す。 lobjNewList = new ListData("",ld.icon,ld.owner,ld.index,ld.row,ld.column);
if (ld.label =="@CheckBox"){ mchkDel.visible =true; } else { mchkDel.visible =false; } super.listData = lobjNewList; } } } ・・・・チェックボックスCellRendererのコード(ここまで)・・・・・
・・・・ボタンCellRendererのコード(ここから)・・・・・ package { import fl.core.UIComponent; import fl.controls.Button; import fl.controls.listClasses.ICellRenderer; import fl.controls.listClasses.CellRenderer; import fl.controls.listClasses.ListData; import flash.text.TextField; import flash.text.TextFieldAutoSize; import flash.events.*; public class buttonCell extends CellRenderer { private var mbtnCheck:Button; public function buttonCell() { mbtnCheck = new Button(); mbtnCheck.setSize(100,22); mbtnCheck.label ="確認"; addChild(mbtnCheck); mbtnCheck.drawNow();
} override public function set listData(ld:ListData):void { var lobjNewList:ListData; //データプロパイダーのaddItem時にセットされたラベルの内容で //チェックボックスの表示・非表示を制御。ただし、このままでは //チェックボックスの背景にld.labelで設定された文字列がそのまま表示 //されてしまうため、新しいListDataオブジェクトを作り、ラベルのみクリアして //基本クラスに渡す。 lobjNewList = new ListData("",ld.icon,ld.owner,ld.index,ld.row,ld.column); if (ld.label =="@Button"){ mbtnCheck.visible =true; } else { mbtnCheck.visible =false; } super.listData=lobjNewList; } override public function get listData():ListData { return _listData; }
} } ・・・・ボタンCellRendererのコード(ここまで)・・・・・
|
|
|
lennox |
Åê¹ÆNo.40930 投稿日時: 2008-12-3 8:37 |
新米   居住地: 投稿: 14
使用環境: ▼ 開発環境 ・メイン:Windows Vista + Flash CS3 Professional ・サブ:MacOS-X + Flash CS3 Professional
▼ 検証環境 ・OS:Windows Vista/XP, Mac OS X ・Browser:IE(6,7), Firefox(2.0.0.14), Opera(9.27), Safari(3.1.1) ・FlashPlayer:onBrowser=9.0.124.0, onPlayer=9.0.115.0
|
Re: DataGrid上のチェックボックスやボタンが表示されない ノーレスですが、解決はしたのでしょうか。 やり方は違いますが、解決策はありますが…。
|
|
|
lennox |
Åê¹ÆNo.40932 投稿日時: 2008-12-3 11:06 |
新米   居住地: 投稿: 14
使用環境: ▼ 開発環境 ・メイン:Windows Vista + Flash CS3 Professional ・サブ:MacOS-X + Flash CS3 Professional
▼ 検証環境 ・OS:Windows Vista/XP, Mac OS X ・Browser:IE(6,7), Firefox(2.0.0.14), Opera(9.27), Safari(3.1.1) ・FlashPlayer:onBrowser=9.0.124.0, onPlayer=9.0.115.0
|
Re: DataGrid上のチェックボックスやボタンが表示されない 閲覧数は多いだけなので、レスつけておきます。 こんな感じでどうでしょうか。 --------------------------------- dgCellRendererSample.as ---------------------------------
package
{
import flash.display.Sprite;
import fl.controls.DataGrid;
import fl.data.DataProvider;
import fl.events.ListEvent;
public class dgCellRendererSample extends Sprite{
var myDP:DataProvider = new DataProvider;
var myDG:DataGrid = new DataGrid();
public function dgCellRendererSample() {
for( var i=0; i<30; i++ ){
myDP.addItem({row:"row[" + i + "]", check:false, dataField:"check" });
}
myDG.width = 300;
myDG.height = 105;
myDG.x = (stage.stageWidth - myDG.width)/2;
myDG.y = (stage.stageHeight - myDG.height)/2;
myDG.addColumn("row");
myDG.addColumn("check");
myDG.getColumnAt(0).headerText = "ROW";
myDG.getColumnAt(1).headerText = "CHECK";
myDG.getColumnAt(1).cellRenderer = ChkCellRenderer;
myDG.dataProvider = myDP;
addChild(myDG);
myDG.addEventListener(ListEvent.ITEM_CLICK, lsnDGClick);
}
private function lsnDGClick( event:ListEvent ):void{
trace(">> lsnDGClick() IN");
trace("## event.columnIndex=[" + event.columnIndex + "]");
trace("## event.rowIndex=[" + event.rowIndex + "]");
trace("## event.index=[" + event.index + "]");
trace("## myDP.getItemAt(" + event.index + ").check=[" + myDP.getItemAt(event.index).check + "]");
}
}
}
--------------------------------- ChkCellRenderer.as ---------------------------------
package{
import fl.controls.ButtonLabelPlacement;
import fl.controls.DataGrid;
import fl.controls.dataGridClasses.DataGridColumn;
import fl.controls.listClasses.ListData;
import fl.controls.listClasses.ICellRenderer;
import fl.controls.LabelButton;
import fl.core.UIComponent;
import flash.events.Event;
import flash.events.MouseEvent;
import fl.controls.CheckBox;
import fl.controls.listClasses.CellRenderer;
import flash.display.DisplayObject;
import fl.core.InvalidationType;
import fl.data.DataProvider;
import flash.system.IME;
[Style(name="icon", type="Class")]
[Style(name="upIcon", type="Class")]
[Style(name="downIcon", type="Class")]
[Style(name="overIcon", type="Class")]
[Style(name="disabledIcon", type="Class")]
[Style(name="selectedDisabledIcon", type="Class")]
[Style(name="selectedUpIcon", type="Class")]
[Style(name="selectedDownIcon", type="Class")]
[Style(name="selectedOverIcon", type="Class")]
[Style(name="upSkin", type="Class")]
[Style(name="downSkin", type="Class")]
[Style(name="overSkin", type="Class")]
[Style(name="disabledSkin", type="Class")]
[Style(name="selectedDisabledSkin", type="Class")]
[Style(name="selectedUpSkin", type="Class")]
[Style(name="selectedDownSkin", type="Class")]
[Style(name="selectedOverSkin", type="Class")]
[Style(name="textFormat", type="flash.text.TextFormat")]
[Style(name="disabledTextFormat", type="flash.text.TextFormat")]
[Style(name="textPadding", type="Number", format="Length")]
public class ChkCellRenderer extends CheckBox implements ICellRenderer {
protected var _listData:ListData;
protected var _data:Object;
protected var _rowSelected:Boolean = true;
protected var _dataField:String;
public function ChkCellRenderer():void {
super();
focusEnabled = false;
}
private static var defaultStyles:Object = { icon:null,
upIcon:"CheckBox_upIcon",downIcon:"CheckBox_downIcon",overIcon:"CheckBox_overIcon",
disabledIcon:"CheckBox_disabledIcon",
selectedDisabledIcon:"CheckBox_selectedDisabledIcon",
focusRectSkin:null,
focusRectPadding:null,
selectedUpIcon:"CheckBox_selectedUpIcon",selectedDownIcon:"CheckBox_selectedDownIcon",selectedOverIcon:"CheckBox_selectedOverIcon",
upSkin:"CellRenderer_upSkin",downSkin:"CellRenderer_downSkin",overSkin:"CellRenderer_overSkin",
disabledSkin:"CellRenderer_disabledSkin",
selectedDisabledSkin:"CellRenderer_selectedDisabledSkin",
selectedUpSkin:"CellRenderer_selectedUpSkin",selectedDownSkin:"CellRenderer_selectedDownSkin",selectedOverSkin:"CellRenderer_selectedOverSkin",
textFormat:null,
disabledTextFormat:null,
embedFonts:null,
textPadding:5 };
public static function getStyleDefinition():Object { return defaultStyles; }
override public function setSize(width:Number,height:Number):void {
super.setSize(width, height);
}
public function get listData():ListData {
return _listData;
}
public function set listData(value:ListData):void {
_listData = value;
label = _listData.label;
setStyle("icon", _listData.icon);
}
public function get data():Object {
return _data;
}
public function set data(value:Object):void {
_data = value;
_dataField = value.dataField;
super.selected = _data[_dataField]
super.drawNow();
}
override public function get selected():Boolean {
return super.selected;
}
override public function set selected(value:Boolean):void {
_rowSelected = value;
}
public function get imeMode():String {
return _imeMode;
}
public function set imeMode(value:String):void {
_imeMode = value;
}
override protected function toggleSelected(event:MouseEvent):void {
( _data.check == "true" || _data.check == 1 || _data.check == true )? _data.check = false : _data.check = true;
super.selected = _data[_dataField]
super.drawNow();
}
override protected function drawLayout():void {
var textPadding:Number = Number(getStyleValue("textPadding"));
var textFieldX:Number = 0;
if (icon != null) {
icon.x = textPadding;
icon.y = Math.round((height-icon.height)>>1);
textFieldX = icon.width + textPadding;
}
if (label.length > 0) {
textField.visible = true;
var textWidth:Number = Math.max(0, width - textFieldX - textPadding*2);
textField.width = textWidth;
textField.height = textField.textHeight + 4;
textField.x = textFieldX + textPadding
textField.y = Math.round((height-textField.height)>>1);
} else {
textField.visible = false;
}
background.width = width;
background.height = height;
}
override protected function drawBackground():void{
var styleName:String = (enabled) ? mouseState : "disabled";
if (_rowSelected) {
styleName = "selected"+styleName.substr(0,1).toUpperCase()+styleName.substr(1);
}
styleName += "Skin";
var bg:DisplayObject = background;
background = getDisplayObjectInstance(getStyleValue(styleName));
addChildAt(background, 0);
if (bg != null && bg != background) { removeChild(bg); }
}
}
}
|
|
|
にぎりめし |
Åê¹ÆNo.47675 投稿日時: 2011-7-2 20:57 |
新米   居住地: 投稿: 4
使用環境: WinXP, Flash CS3
|
Re: DataGrid上のチェックボックスやボタンが表示されない 自分も試してみました。 自身はないですが、一応表示はされてます。 Main.as
package
{
import fl.controls.*;
import flash.events.*;
import flash.display.*;
public class Main extends Sprite
{
private var m_dg:DataGrid;
private var m_shapes:Array;
public function Main():void
{
var dg:DataGrid;
dg = new DataGrid();
dg.x = 40;
dg.y = 40;
dg.width = 280;
dg.height = 100;
dg.columns = ["設定1","設定2"];
for ( var idx:int = 0; idx < 10; ++idx )
{
var str = "" + idx;
var selected = 0.5 <= Math.random();
var a = { label:str, selected:selected };
var b = { label:str, selected:selected };
dg.addItem( { value1:a, value2:b } );
}
dg.getColumnAt(0).width = 140;
dg.getColumnAt(0).dataField = "value1";
dg.getColumnAt(0).cellRenderer = CustomCellRenderer_CheckBox;
dg.getColumnAt(1).width = 140;
dg.getColumnAt(1).dataField = "value2";
dg.getColumnAt(1).cellRenderer = CustomCellRenderer_CheckBox;
this.addChild( dg );
m_dg = dg;
m_shapes = [];
for ( idx = 0; idx < 20; ++idx)
{
var s = new Shape();
m_shapes.push(s);
this.addChild(s);
}
addEventListener( Event.ENTER_FRAME, enterFrame );
}
private function enterFrame(e:Event):void
{
for( var row:int = 0; row < m_dg.length; ++row )
{
var obj = m_dg.dataProvider.getItemAt(row);
var s:Shape;
s = m_shapes[row * 2];
s.x = 440;
s.y = 40 + row * 20;
drawShape( s, obj["value1"].selected );
s = m_shapes[(row * 2) + 1];
s.x = 440 + 20;
s.y = 40 + row * 20;
drawShape( s, obj["value2"].selected );
}
}
private function drawShape( s:Shape, selected:Boolean ):void
{
var g:Graphics = s.graphics;
g.clear();
g.beginFill(( selected ? 0xFF0000 : 0x404040));
g.drawRect(0,0,18,18);
g.endFill();
}
}
}
CustomCellRenderer_CheckBox.as
package
{
import flash.events.MouseEvent;
import fl.controls.CheckBox;
import fl.controls.DataGrid;
import fl.controls.listClasses.CellRenderer;
public dynamic class CustomCellRenderer_CheckBox extends CellRenderer
{
private var m_chkBox:CheckBox;
public function CustomCellRenderer_CheckBox():void
{
super();
// CellRendererのテキスト描画を消す
this.textField.visible = false;
m_chkBox = new CheckBox();
m_chkBox.tabEnabled = false;
this.addChild( m_chkBox );
this.addEventListener( MouseEvent.CLICK, onClick );
this.addEventListener( MouseEvent.DOUBLE_CLICK, onClick );
}
public override function drawNow():void
{
super.drawNow();
if( data == null )
{
throw new Error("data=null");
}
for( var propName:String in cellInfo )
{
if( m_chkBox[propName] != null )
{
m_chkBox[propName] = cellInfo[propName];
}
}
m_chkBox.drawNow();
}
public override function setSize( width:Number, height:Number ):void
{
super.setSize(width, height);
if( m_chkBox != null ) m_chkBox.setSize( width, height );
}
// CellRendererのテキスト描画を消す
protected override function drawLayout():void
{
background.width = width;
background.height = height;
}
private function onClick(e:MouseEvent):void
{
// チェックボックスをクリックしたかチェック
// if( !m_chkBox.hitTestPoint(e.stageX, e.stageY)) return;
var value:Boolean = !cellInfo.selected;
m_chkBox.selected = value;
cellInfo.selected = value;
}
// カスタムセルレンダラが設定されているセルのデータを返す
private function get cellInfo():*
{
var dgc = DataGrid(_listData.owner).getColumnAt(_listData.column);
return _data[dgc.dataField];
}
}
}
|
|
|
にぎりめし |
Åê¹ÆNo.47676 投稿日時: 2011-7-2 21:06 |
新米   居住地: 投稿: 4
使用環境: WinXP, Flash CS3
|
Re: DataGrid上のチェックボックスやボタンが表示されない ComboBoxバージョン Main.as
package
{
import fl.controls.*;
import flash.events.*;
import flash.display.*;
import fl.data.*;
import flash.geom.*;
public class Main extends Sprite
{
public function Main():void
{
var dg:DataGrid;
dg = new DataGrid();
dg.x = 100;
dg.y = 40;
dg.width = 280;
dg.height = 100;
dg.columns = ["設定1","設定2"];
for (var idx:int = 0; idx < 10; ++idx )
{
var str = "" + idx;
var selected = 0.5 <= Math.random();
var dp;
dp = new DataProvider();
for ( var cnt:int = Math.random() * 10; 0 <= cnt; --cnt ) dp.addItemAt({ label:idx + "-" + cnt }, 0);
var a = new ListObj(dp);
dp = new DataProvider();
for ( cnt = Math.random() * 10; 0 <= cnt; --cnt ) dp.addItemAt({ label:idx + "-" + cnt }, 0);
var b = new ListObj(dp);
dg.addItem( { value1:a, value2:b } );
}
dg.getColumnAt(0).width = 140;
dg.getColumnAt(0).dataField = "value1";
dg.getColumnAt(0).cellRenderer = CustomCellRenderer_ComboBox;
dg.getColumnAt(1).width = 140;
dg.getColumnAt(1).dataField = "value2";
dg.getColumnAt(1).cellRenderer = CustomCellRenderer_ComboBox;
this.addChild( dg );
}
}
}
ComboBox2.as
package
{
import fl.controls.ComboBox;
public class ComboBox2 extends ComboBox
{
// デフォルトのComboBoxクラスは、子コンポーネントを正しく再描画していないようなので修正
override protected function draw():void
{
super.draw();
/*
* 子コンポーネントinputField,listの再描画を行う
*/
inputField.drawNow();
list.drawNow();
}
}
}
CustomCellRenderer_ComboBox.as
package
{
import flash.events.Event;
import fl.controls.ComboBox;
import fl.controls.DataGrid;
import fl.controls.listClasses.CellRenderer;
public dynamic class CustomCellRenderer_ComboBox extends CellRenderer
{
private var m_cmbBox:ComboBox;
public function CustomCellRenderer_ComboBox():void
{
super();
this.buttonMode = false;
this.mouseChildren = true;
this.textField.visible = false;
m_cmbBox = new ComboBox2();
m_cmbBox.tabEnabled = false;
m_cmbBox.addEventListener( Event.CHANGE, onChange );
this.addChild( m_cmbBox );
}
private function onChange(e:Event):void
{
cellInfo.selectedIndex = m_cmbBox.selectedIndex;
}
public override function setSize( width:Number, height:Number ):void
{
super.setSize(width, height);
if( m_cmbBox != null ) m_cmbBox.setSize( width, height );
}
public override function drawNow():void
{
super.drawNow();
var listObj:ListObj = ListObj( cellInfo );
m_cmbBox.dataProvider = listObj.dp;
m_cmbBox.selectedIndex = listObj.selectedIndex;
m_cmbBox.drawNow();
}
// CellRendererのテキスト描画を消す
protected override function drawLayout():void
{
background.width = width;
background.height = height;
}
// カスタムセルレンダラが設定されているセルのデータを返す
private function get cellInfo():*
{
var dgc = DataGrid(_listData.owner).getColumnAt(_listData.column);
return _data[dgc.dataField];
}
}
}
ListObj.as
package
{
import fl.data.DataProvider;
public class ListObj
{
public var dp:DataProvider;
public var selectedIndex:int;
public function ListObj( dp:DataProvider = null, selectedIndex:int = -1 ):void
{
this.dp = dp || new DataProvider();
this.selectedIndex = selectedIndex;
}
}
}
|
|
|
|
 |