チェンジセット 1620

差分発生行の前後
無視リスト:
コミット日時:
2008/10/15 02:36:28 (3 ヶ月前)
コミッタ:
n_mattun
ログメッセージ:

borderBoxの各線をShapeでの描画に変更(これでアルファかけても大丈夫)、あと各線のcolorプロパティを作成。

ファイル:

凡例:

変更無し
追加
削除
更新
コピー
移動
  • mxp/specialbutton/as3/src/n_mattun/display/BorderBox.as

    r1599 r1620  
    2121        // 必要なパッケージの読み込み. 
    2222        import flash.display.MovieClip; 
     23        import flash.display.Sprite; 
    2324        import flash.geom.ColorTransform; 
    24       import n_mattun.display.Line; 
     25//    import n_mattun.display.Line; 
    2526        import n_mattun.display.Corner; 
    2627 
     
    3233                public var __alpha              :Number = 1; 
    3334                public var __color              :uint   = 0x000000; 
     35                public var __tColor             :uint   = 0x000000; 
     36                public var __bColor             :uint   = 0x000000; 
     37                public var __lColor             :uint   = 0x000000; 
     38                public var __rColor             :uint   = 0x000000; 
    3439                public var __cornerSize :Number = 5; 
    3540                public var __borderSize :Number = 2; 
     
    4651                public var RB:Corner = new Corner(); 
    4752                //Lines 
    48                 public var T:Line = new Line(); 
    49                 public var B:Line = new Line(); 
    50                 public var L:Line = new Line(); 
    51                 public var R:Line = new Line(); 
     53                //public var LineShape:Sprite = new Sprite(); 
     54                public var T:Sprite = new Sprite(); 
     55                public var B:Sprite = new Sprite(); 
     56                public var L:Sprite = new Sprite(); 
     57                public var R:Sprite = new Sprite(); 
     58                //mask 
     59                public var _mask:Sprite = new Sprite(); 
     60                 
    5261                 
    5362                // コンストラクタ 
     
    7786                        }catch(e){ 
    7887                        } 
    79                          
    80                         //角と線を生成する 
    81                         createLines(); 
     88                        //各線をaddChild 
     89                        addChild(T); 
     90                        addChild(B); 
     91                        addChild(L); 
     92                        addChild(R); 
     93                        //角を生成 
    8294                        createCorners(); 
     95                        //マスクをaddChild 
     96                        addChild(_mask); 
     97                         
    8398                        //各種初期パラメータをセット 
    8499                        this.cornerPart = __cornerPart; 
     
    87102                        this.color      = __color; 
    88103                        this.borderSize = __borderSize; 
    89                         updateLineEnabled(); 
    90                          
     104                        //updateLineEnabled(); 
    91105                } 
    92106                // ===================================================================// 
     
    95109                [Inspectable(defaultValue="#000000", name="01.色", type="Color")] 
    96110                public function set color(_num:uint){ 
    97                         T.color = _num; 
    98                         B.color = _num; 
    99                         L.color = _num; 
    100                         R.color = _num; 
     111                        __color = _num; 
     112                        __tColor = _num; 
     113                        __bColor = _num; 
     114                        __lColor = _num; 
     115                        __rColor = _num; 
    101116                        LT.color = _num; 
    102117                        RT.color = _num; 
    103118                        LB.color = _num; 
    104119                        RB.color = _num; 
     120                        updateLineShape(); 
     121                } 
     122                // -------------------------------------------------------------------// 
     123                public function set tColor(_num:uint){ 
     124                        __tColor = _num; 
     125                        RT.color = _num; 
     126                        updateLineShape(); 
     127                } 
     128                // -------------------------------------------------------------------// 
     129                public function set bColor(_num:uint){ 
     130                        __bColor = _num; 
     131                        LB.color = _num; 
     132                        updateLineShape(); 
     133                } 
     134                // -------------------------------------------------------------------// 
     135                public function set lColor(_num:uint){ 
     136                        __lColor = _num; 
     137                        LT.color = _num; 
     138                        updateLineShape(); 
     139                } 
     140                // -------------------------------------------------------------------// 
     141                public function set rColor(_num:uint){ 
     142                        __rColor = _num; 
     143                        RB.color = _num; 
     144                        updateLineShape(); 
    105145                } 
    106146                // -------------------------------------------------------------------// 
     
    111151                        } 
    112152                        __w = _num; 
    113                         T.width = _num-(cornerSize*2); 
    114                         B.width = _num-(cornerSize*2); 
    115                         R.x = _num-borderSize; 
    116153                        RT.x = _num-cornerSize; 
    117154                        RB.x = _num-cornerSize; 
    118                         cornerSize = __cornerSize; 
     155                        borderSize = __borderSize; 
    119156                } 
    120157                // -------------------------------------------------------------------// 
     
    125162                        } 
    126163                        __h = _num; 
    127                         L.width = _num-(cornerSize*2); 
    128                         R.width = _num-(cornerSize*2); 
    129                         B.y = _num-borderSize; 
    130                         LB.y = L.width+L.y; 
    131                         RB.y = R.width+R.y; 
    132                         cornerSize = __cornerSize; 
     164                        LB.y = _num-cornerSize; 
     165                        RB.y = _num-cornerSize; 
     166                        borderSize = __borderSize; 
    133167                } 
    134168                // -------------------------------------------------------------------// 
     
    138172                        // 設定値と角の丸みに矛盾が出る場合は適正値に戻す 
    139173                        var _max = (__w > __h) ? __h:__w; 
    140                         _max = Math.ceil(_max/2); 
     174                        _max = (_max/2); 
    141175                        if(_max < _num) _num = _max; 
    142176                         
     
    160194                        LB.visible = __cornerPartEnabled.LB; 
    161195                        RB.visible = __cornerPartEnabled.RB; 
    162                         //線の位置をいったんリセット(cornerが無い場合の数字にする) 
    163                         T.x = 0; 
    164                         T.y = 0; 
    165                         L.x = 0; 
    166                         L.y = 0; 
    167                         B.x = 0; 
    168                         B.y = __h; 
    169                         R.x = __w; 
    170                         R.y = 0; 
    171                         T.width = __w; 
    172                         B.width = __w; 
    173                         L.width = __h; 
    174                         R.width = __h; 
    175                         //cornerの表示状態に応じて線の位置を増減する 
    176                         if(__cornerPartEnabled.LT){ 
    177                                 L.width -= _num; 
    178                                 T.width -= _num; 
    179                                 L.y             += _num; 
    180                                 T.x             += _num; 
    181                         } 
    182                         if(__cornerPartEnabled.RT){ 
    183                                 T.width -= _num; 
    184                                 R.width -= _num; 
    185                                 R.y             += _num; 
    186                         } 
    187                         if(__cornerPartEnabled.LB){ 
    188                                 L.width -= _num; 
    189                                 B.width -= _num; 
    190                                 B.x             += _num; 
    191                         } 
    192                         if(__cornerPartEnabled.RB){ 
    193                                 R.width -= _num; 
    194                                 B.width -= _num; 
    195                         } 
    196196                         
    197197                        //線が続いて非表示の場合はその間にあるcornerも非表示にしてしまう。 
     
    201201                        if(!bottomLineEnabled && !rightLineEnabled) RB.visible = false; 
    202202                         
    203                         //線の表示状態に応じて線の位置を若干変える 
    204                         if(bottomLineEnabled == false && cornerPart == "Top"){ 
    205                                 L.width -= borderSize; 
    206                                 R.width -= borderSize; 
    207                         } 
    208                         if(topLineEnabled == false && cornerPart == "Bottom"){ 
    209                                 L.width -= borderSize; 
    210                                 R.width -= borderSize; 
    211                                 L.y += borderSize; 
    212                                 R.y += borderSize; 
    213                         } 
    214                         if(rightLineEnabled == false && cornerPart == "Left"){ 
    215                                 T.width -= borderSize; 
    216                                 B.width -= borderSize; 
    217                         } 
    218                         if(leftLineEnabled == false && cornerPart == "Right"){ 
    219                                 T.width -= borderSize; 
    220                                 B.width -= borderSize; 
    221                                 T.x += borderSize; 
    222                                 B.x += borderSize; 
    223                         } 
     203                        updateLineShape(); 
    224204                } 
    225205                // -------------------------------------------------------------------// 
     
    229209                        // 設定値と角の丸みに矛盾が出る場合は適正値に戻す 
    230210                        var _max = (width > height) ? height:width; 
    231                         _max = Math.ceil(_max/2); 
     211                        _max = (_max/2); 
    232212                        if(_max < _num){ 
    233213                                _num = _max; 
    234214                        } 
    235                          
    236215                        __borderSize = _num; 
    237216                        LT.borderSize = _num; 
     
    239218                        LB.borderSize = _num; 
    240219                        RB.borderSize = _num; 
    241                         L.height = _num; 
    242                         R.height = _num; 
    243                         T.height = _num; 
    244                         B.height = _num; 
    245                          
    246                         T.x = cornerSize; 
    247                         T.y = 0; 
    248                         L.x = 0; 
    249                         L.y = cornerSize; 
    250                         B.x = cornerSize; 
    251                         B.y = height; 
    252                         R.x = width; 
    253                         R.y = cornerSize; 
    254220                        cornerSize = __cornerSize; 
    255                          
    256                         //BorderSizeが0(非表示)の場合は四つ角を非表示にしておく 
    257                         if(_num == 0){ 
    258                                 LT.visible = false; 
    259                                 RT.visible = false; 
    260                                 LB.visible = false; 
    261                                 RB.visible = false; 
    262                         }else{ 
    263                                 LT.visible = true; 
    264                                 RT.visible = true; 
    265                                 LB.visible = true; 
    266                                 RB.visible = true; 
    267                         } 
    268221                } 
    269222                // -------------------------------------------------------------------// 
     
    334287                                break; 
    335288                        } 
    336                         cornerSize = __cornerSize; 
     289                        borderSize = __borderSize; 
    337290                } 
    338291                // -------------------------------------------------------------------// 
     
    340293                public function set topLineEnabled(_bool:Boolean){ 
    341294                        __topLineEnabled = _bool; 
    342                         updateLineEnabled()
     295                        borderSize = __borderSize
    343296                } 
    344297                // -------------------------------------------------------------------// 
     
    346299                public function set bottomLineEnabled(_bool:Boolean){ 
    347300                        __bottomLineEnabled = _bool; 
    348                         updateLineEnabled()
     301                        borderSize = __borderSize
    349302                } 
    350303                // -------------------------------------------------------------------// 
     
    352305                public function set leftLineEnabled(_bool:Boolean){ 
    353306                        __leftLineEnabled = _bool; 
    354                         updateLineEnabled()
     307                        borderSize = __borderSize
    355308                } 
    356309                // -------------------------------------------------------------------// 
     
    358311                public function set rightLineEnabled(_bool:Boolean){ 
    359312                        __rightLineEnabled = _bool; 
    360                         updateLineEnabled()
     313                        borderSize = __borderSize
    361314                } 
    362315                // ===================================================================// 
     
    372325                // -------------------------------------------------------------------// 
    373326                public function get color():uint{ 
    374                         return this.__color; 
     327                        return __color; 
     328                } 
     329                // -------------------------------------------------------------------// 
     330                public function get tColor():uint{ 
     331                        return __tColor; 
     332                } 
     333                // -------------------------------------------------------------------// 
     334                public function get bColor():uint{ 
     335                        return __bColor; 
     336                } 
     337                // -------------------------------------------------------------------// 
     338                public function get lColor():uint{ 
     339                        return __lColor; 
     340                } 
     341                // -------------------------------------------------------------------// 
     342                public function get rColor():uint{ 
     343                        return __rColor; 
    375344                } 
    376345                // -------------------------------------------------------------------// 
    377346                public function get cornerSize():Number{ 
    378                         return this.__cornerSize; 
     347                        return __cornerSize; 
    379348                } 
    380349                // -------------------------------------------------------------------// 
    381350                public function get borderSize():Number{ 
    382                         return this.__borderSize; 
     351                        return __borderSize; 
    383352                } 
    384353                // -------------------------------------------------------------------// 
    385354                public function get cornerPart():String{ 
    386                         return this.__cornerPart; 
     355                        return __cornerPart; 
    387356                } 
    388357                // -------------------------------------------------------------------// 
     
    454423                } 
    455424                // -------------------------------------------------------------------// 
    456                 //線を生成 
    457                 private function createLines():void { 
    458                         addChild(T); 
    459                         addChild(B); 
    460                         addChild(L); 
    461                         addChild(R); 
    462                          
    463                         T.name = "T"; 
    464                         B.name = "B"; 
    465                         L.name = "L"; 
    466                         R.name = "R"; 
    467                          
    468                         //初期配置 
    469                         T.x = __cornerSize; 
    470                         T.y = 0; 
    471                         T.width  = __w-(__cornerSize*2); 
    472                         T.height = __borderSize; 
    473                          
    474                         B.x = __cornerSize; 
    475                         B.y = __h; 
    476                         B.scaleY = -1; 
    477                         B.width  = __w-(__cornerSize*2); 
    478                         B.height = __borderSize; 
    479                          
    480                         L.x = 0; 
    481                         L.y = __cornerSize; 
    482                         L.rotation = 90; 
    483                         L.scaleY = -1; 
    484                         L.width  = __h-(__cornerSize*2); 
    485                         L.height = __borderSize; 
    486                          
    487                         R.x = width; 
    488                         R.y = __cornerSize; 
    489                         R.rotation = 90; 
    490                         R.width  = __h-(__cornerSize*2); 
    491                         R.height = __borderSize;         
    492                  
    493                 } 
    494                 // -------------------------------------------------------------------// 
    495                 //線の表示可否を更新 
    496                 private function updateLineEnabled():void { 
    497                         (__topLineEnabled)    ? T.visible = true : T.visible = false; 
    498                         (__bottomLineEnabled) ? B.visible = true : B.visible = false; 
    499                         (__leftLineEnabled)   ? L.visible = true : L.visible = false; 
    500                         (__rightLineEnabled)  ? R.visible = true : R.visible = false; 
    501                         cornerSize = __cornerSize; 
     425                //線の表示状態を更新 
     426                private function updateLineShape():void { 
     427                         
     428                        var _abs :Number = Math.abs(borderSize - cornerSize); 
     429                        var _bs  :Number = borderSize; 
     430                         
     431                        T.graphics.clear(); 
     432                        L.graphics.clear(); 
     433                        B.graphics.clear(); 
     434                        R.graphics.clear(); 
     435                         
     436                        //角の色に準拠させる 
     437                        T.graphics.beginFill(tColor); 
     438                        L.graphics.beginFill(lColor); 
     439                        B.graphics.beginFill(bColor); 
     440                        R.graphics.beginFill(rColor); 
     441            //こっちは描画領域確認用 
     442                        //T.graphics.beginFill(0xFF0000); 
     443                        //L.graphics.beginFill(0x00FF00); 
     444                        //B.graphics.beginFill(0x0000FF); 
     445                        //R.graphics.beginFill(0x999999); 
     446                         
     447            T.graphics.drawRect(cornerSize,0,__w-(cornerSize*2),_bs);           //T塗り 
     448            L.graphics.drawRect(0,cornerSize,_bs,__h-(cornerSize*2));           //L塗り 
     449            B.graphics.drawRect(cornerSize,__h-_bs,__w-(cornerSize*2),_bs);     //B塗り 
     450            R.graphics.drawRect(__w-_bs,cornerSize,_bs,__h-(cornerSize*2));     //R塗り 
     451                         
     452                        //コーナーの有無に応じて角を描画 
     453                        if(__cornerPartEnabled.RT == false){//右上 
     454                                T.graphics.drawRect(__w-cornerSize,0,cornerSize,cornerSize); 
     455                                if(cornerSize > _bs) T.graphics.drawRect(__w-cornerSize,_bs,_abs,_abs); 
     456                        } 
     457                        if(__cornerPartEnabled.RB == false){//右下 
     458                                R.graphics.drawRect(__w-cornerSize,__h-cornerSize,cornerSize,cornerSize); 
     459                                if(cornerSize > _bs) R.graphics.drawRect(__w-cornerSize,__h-cornerSize,_abs,_abs); 
     460                        } 
     461                        if(__cornerPartEnabled.LB == false){//左下 
     462                                B.graphics.drawRect(0,__h-cornerSize,cornerSize,cornerSize); 
     463                                if(cornerSize > _bs) B.graphics.drawRect(_bs,__h-cornerSize,_abs,_abs); 
     464                        } 
     465                        if(__cornerPartEnabled.LT == false){//左上 
     466                                L.graphics.drawRect(0,0,cornerSize,cornerSize); 
     467                                if(cornerSize > _bs) L.graphics.drawRect(_bs,_bs,_abs,_abs); 
     468                        } 
     469                        //二重塗りになってしまう部分(各角の内側)の再描画 
     470                        if(cornerSize < _bs){ 
     471                                T.graphics.drawRect(cornerSize,cornerSize,_abs,_abs);   //左上 
     472                                R.graphics.drawRect(__w-_bs,cornerSize,_abs,_abs);              //右上 
     473                                B.graphics.drawRect(__w-_bs,__h-_bs,_abs,_abs);                 //右下 
     474                                L.graphics.drawRect(cornerSize,__h-_bs,_abs,_abs);              //左下 
     475                        } 
     476            T.graphics.endFill(); 
     477            L.graphics.endFill(); 
     478            B.graphics.endFill(); 
     479            R.graphics.endFill(); 
     480                         
     481                        updateMaskStatus(); 
     482                } 
     483                // -------------------------------------------------------------------// 
     484                //マスクの表示状態を更新 
     485                private function updateMaskStatus():void { 
     486                        _mask.graphics.clear(); 
     487                        var _bs = borderSize; 
     488                        var _vx = 0; 
     489                        var _vy = 0; 
     490                        var _vw = __w; 
     491                        var _vh = __h; 
     492                        //線が全部表示の場合はそもそもマスクを適用しない 
     493                        if(__topLineEnabled    == true && 
     494                           __bottomLineEnabled == true && 
     495                           __leftLineEnabled   == true && 
     496                           __rightLineEnabled  == true ) 
     497                        { 
     498                                mask  = null; 
     499                                _mask.visible = false; 
     500                        }else{ 
     501                                if(__topLineEnabled == false){ 
     502                                        _vy+=_bs; 
     503                                        _vh-=_bs; 
     504                                } 
     505                                if(__bottomLineEnabled == false){ 
     506                                        _vh-=_bs; 
     507                                } 
     508                                if(__leftLineEnabled == false){ 
     509                                        _vx+=_bs; 
     510                                        _vw-=_bs; 
     511                                } 
     512                                if(__rightLineEnabled == false){ 
     513                                        _vw-=_bs; 
     514                                } 
     515                                //描画領域がちゃんとある場合のみ描画 
     516                                if(_vw > 0 && _vh > 0){ 
     517                                        _mask.graphics.beginFill(0x000000); 
     518                                        _mask.graphics.drawRect(_vx,_vy,_vw,_vh); 
     519                                        _mask.visible = true; 
     520                                        this.mask = _mask; 
     521                                } 
     522                        } 
     523                        _mask.graphics.endFill(); 
    502524                } 
    503525                // -------------------------------------------------------------------// 
  • mxp/specialbutton/as3/src/n_mattun/display/ButtonBox.as

    r1599 r1620  
    368368                         
    369369                        __outerColors = _obj; 
    370                          
    371                         outer.T.color  = _obj.top; 
    372                         outer.RT.color = _obj.top; 
    373                         outer.B.color  = _obj.bottom; 
    374                         outer.LB.color = _obj.bottom; 
    375                         outer.L.color  = _obj.left; 
    376                         outer.LT.color = _obj.left; 
    377                         outer.R.color  = _obj.right; 
    378                         outer.RB.color = _obj.right; 
     370                        outer.tColor  = _obj.top; 
     371                        outer.bColor  = _obj.bottom; 
     372                        outer.lColor  = _obj.left; 
     373                        outer.rColor  = _obj.right; 
    379374                } 
    380375                // -------------------------------------------------------------------// 
    381376                public function set innerColors(_obj:Object):void { 
    382377                        __innerColors = _obj; 
    383                          
    384                         inner.T.color  = _obj.top; 
    385                         inner.RT.color = _obj.top; 
    386                         inner.B.color  = _obj.bottom; 
    387                         inner.LB.color = _obj.bottom; 
    388                         inner.L.color  = _obj.left; 
    389                         inner.LT.color = _obj.left; 
    390                         inner.R.color  = _obj.right; 
    391                         inner.RB.color = _obj.right; 
     378                        inner.tColor  = _obj.top; 
     379                        inner.bColor  = _obj.bottom; 
     380                        inner.lColor  = _obj.left; 
     381                        inner.rColor  = _obj.right; 
    392382                } 
    393383                // ===================================================================// 
  • mxp/specialbutton/as3/src/sample.txt

    r1599 r1620  
    88 up/over/dowm/disable時のviewまわり  〆 
    99 borderBoxに各種lineEnabledを実装したいね。                〆 
     10 各種コンポーネントをnewで確実に生成できるように。     〆 
     11 borderBoxの描画で、cornerSize < borderSize の状態でアルファをかけると 
     12 角の内側が二重に描画してるので均一に透明にならない状態をどうにかしたい。   〆 
    1013 
    1114 
    1215■これから実装するもの 
    1316 
    14  toolTip 
    15  shortCut 
    16         →shortCutクラスを作っちゃった方がよさげ。isDownとかチェックしたいし。 
    17  sizeChangePoint 
    18  overImage 
     17 spb.toolTip 
     18 spb.sizeChangePoint 
     19 spb.overImage 
     20 spb.shortCutKey        //ショートカットキー 
     21 spb.delay                      //ハンドラ発動までの待ち時間 
     22 spb.isRepeat           //ボタン押下中にずっとハンドラを発動させるかどうか(発動ハンドラはdownHandler) 
     23 spb.interval           //↑実行の実行間隔 
     24 
     25 ハンドラの種類にrepeatハンドラを追加? 
    1926 日本語プロパティの英語表記プロパティも平行実装? 
    2027 
     28 
    2129■のちのち実装したいもの 
    22  各種コンポーネントをnewで確実に生成できるように。     〆 
    23  movieClipの入れ子継承じゃなくてクラス継承に作り変え(無理だと思うけど・・・) 
     30 textlabel単体,imageLabel単体のコンポーネント化