日本語プログラミング言語なでしこの公式掲示板
なでしこ の 掲示板
種類 :本文
キーワード:＃
2024-01-31 12:45:22
1823 : Re①:ホットキーで１時中断して再開する方法
92行目/＃「F2」に「ループを動かす」をホットキー登録
いろいろやり方はありますが、元のプログラムをあまり変えないように変更してみました。
動作フラグ用に、1＝「中断」、1＜＞で「再開」として、「一時中断」の変数を作って。
ループ中の処理を「一時中断」の値でスキップ(中断)するようにしました。
#ここから
エディタ1とはエディタ
エディタ2とはエディタ
imgとはイメージ
imgの可視はオフ
＃imgについて
＃不要？
一時中断とは、整数
一時中断は、1
＃1＝中断
「F1」に「ループ止める」をホットキー登録
＃「を」を入れると動かない
「F2」に「ループ動かす」をホットキー登録
＃「を」を入れると動かない
1でループ
もし 一時中断＜＞1ならば
PP=机上マウスX
MM=机上マウスY
imgへ「デスクトップ」を窓キャプチャ
MTY=imgのPP,MMを点取得
MTY=RGB分解1(MTY)
エディタ1へMTYを代入
MTY2=imgのPP,MMを点取得
MTY2=RGB分解2(MTY2)
エディタ2へMTY2を代入
違えば
＃一時中断
0.2秒待つ
＃ もし （「｛デスクトップ｝123.txt」の存在＝はい）ならば 抜ける
＃「F1」に「ループを止める」をホットキー登録
＃「F2」に「ループを動かす」をホットキー登録
＃「F1」のホットキー登録
●ループ止める
一時中断は、1
＃一時中断
＃「F2」のホットキー登録
●ループ動かす
一時中断は、0
＃一時中断解除
●RGB分解1(MTYor)
rgbとは変数
rgb[0]=INT(MTYor/256/256)
rgb[1]=INT(MTYor/256)%256
rgb[2]=INT(MTYor%256)
rgbを「,」で配列結合
それを戻す
●RGB分解2(MTY2or)
rgbとは変数
rgb[0]=INT(MTY2or/256/256)
rgb[1]=INT(MTY2or/256)%256
rgb[2]=INT(MTY2or%256)
rgb==RGB（rgb[0],rgb[1],rgb[2])
HEX（rgb）
それを戻す
#ここまで
#抜けるを使うと止めることができても、再起動しないといけないのでいろいろ考えましたが、うまくいきません。時計を停止だと時計を止めることができましたが、imgだと簡単に止められません。
■本文始まり■
下のプログラムは、座標のGRBとそれを16進法したものを表示するプログラムです。F1で動きを止め、F2で再開するプログラムにしたいですがうまくいきません。
#ここから
エディタ1とはエディタ
エディタ2とはエディタ
imgとはイメージ
imgの可視はオフ
imgについて
1でループ
PP=机上マウスX
MM=机上マウスY
imgへ「デスクトップ」を窓キャプチャ
MTY=imgのPP,MMを点取得
MTY=RGB分解1(MTY)
エディタ1へMTYを代入
MTY2=imgのPP,MMを点取得
MTY2=RGB分解2(MTY2)
エディタ2へMTY2を代入
0.2秒待つ
＃ もし （「｛デスクトップ｝123.txt」の存在＝はい）ならば 抜ける
＃「F1」に「ループを止める」をホットキー登録
＃「F2」に「ループを動かす」をホットキー登録
●RGB分解1(MTYor)
rgbとは変数
rgb[0]=INT(MTYor/256/256)
rgb[1]=INT(MTYor/256)%256
rgb[2]=INT(MTYor%256)
rgbを「,」で配列結合
それを戻す
●RGB分解2(MTY2or)
rgbとは変数
rgb[0]=INT(MTY2or/256/256)
rgb[1]=INT(MTY2or/256)%256
rgb[2]=INT(MTY2or%256)
rgb==RGB（rgb[0],rgb[1],rgb[2])
HEX（rgb）
それを戻す
#ここまで
#抜けるを使うと止めることができても、再起動しないといけないのでいろいろ考えましたが、うまくいきません。時計を停止だと時計を止めることができましたが、imgだと簡単に止められません。
■本文終わり■
2024-01-31 07:36:36
1822 : ホットキーで１時中断して再開する方法
23行目/＃「F2」に「ループを動かす」をホットキー登録
下のプログラムは、座標のGRBとそれを16進法したものを表示するプログラムです。F1で動きを止め、F2で再開するプログラムにしたいですがうまくいきません。
#ここから
エディタ1とはエディタ
エディタ2とはエディタ
imgとはイメージ
imgの可視はオフ
imgについて
1でループ
PP=机上マウスX
MM=机上マウスY
imgへ「デスクトップ」を窓キャプチャ
MTY=imgのPP,MMを点取得
MTY=RGB分解1(MTY)
エディタ1へMTYを代入
MTY2=imgのPP,MMを点取得
MTY2=RGB分解2(MTY2)
エディタ2へMTY2を代入
0.2秒待つ
＃ もし （「｛デスクトップ｝123.txt」の存在＝はい）ならば 抜ける
＃「F1」に「ループを止める」をホットキー登録
＃「F2」に「ループを動かす」をホットキー登録
●RGB分解1(MTYor)
rgbとは変数
rgb[0]=INT(MTYor/256/256)
rgb[1]=INT(MTYor/256)%256
rgb[2]=INT(MTYor%256)
rgbを「,」で配列結合
それを戻す
●RGB分解2(MTY2or)
rgbとは変数
rgb[0]=INT(MTY2or/256/256)
rgb[1]=INT(MTY2or/256)%256
rgb[2]=INT(MTY2or%256)
rgb==RGB（rgb[0],rgb[1],rgb[2])
HEX（rgb）
それを戻す
#ここまで
#抜けるを使うと止めることができても、再起動しないといけないのでいろいろ考えましたが、うまくいきません。時計を停止だと時計を止めることができましたが、imgだと簡単に止められません。
2024-01-16 12:13:43
1817 : 絶対指定の方がいいかも
58行目/＃重ねるキャンバス
すでに解決してるとこアレなんですが～。
選択範囲のガイドラインを引きたいだけかと思ったのでお手軽に二枚を重ねる方法をお伝えしましたが、
■リンク■https://n3s.nadesi.com/id.php?2726
を拝見しまして、エディタ画面だと大丈夫だけど、アプリ画面だとサブキャンバスを作った時にピュッてずれますよね～😅
またレイヤー操作のできるお絵かきソフトを作りたいとゆうことは、重ねるのは二枚とは限らないことを考えますと、ポジションの指定は絶対位置(absolute)の方がいいだろうなと思いましたので、追記。
実は、画面内に収まるサイズのキャンバス二枚なら横に並んで表示されるのですが、画像がだいぶ大きかったり、複数枚あったりして収まりきらない場合は、下に行きます！
相対位置指定の基準位置(0,0)は何も指定せずに表示した時の場所なので、下に表示された状態で左にずらしたら、あれキャンバスどこ行った？！ て事態になります💧
絶対位置指定の基準位置は、何もしなければ画面全体の左上なのですが、親ボックスにstatic(配置方法を指定しない)以外のポジション設定がなされていると親ボックスの左上が基準位置となります。
ですので、親ボックスとしてdiv要素を部品作成してpositionにrelativeをつけ、その中にabsoluteを付けたキャンバスを作成していけばOK。何枚でも重ねられます☆
あと、メインキャンバスをマウス押した時で、マウスX取れていませんよね？
キャンバスは、作成した順に重なっているので、先に作ったメインキャンバスはサブキャンバスの下になっていてマウスを検知できていません。
ですので、サブキャンバスとすればマウス位置取得出来るんですが、どちらかというとマウスを検知したりガイドラインを描画したりする操作用のキャンバスを別途作って、後から何枚レイヤーを増やそうとも必ず一番上になるようz-indexを高く指定しておくのがいいんじゃないでしょうか。
#------------------
＃元のキャンバスは使わない
描画中キャンバスの「幅」に0をDOM属性設定。
描画中キャンバスの「高さ」に0をDOM属性設定。
＃画像準備
画像URL１＝「https://n3s.nadesi.com/image.php?f=1.jpg」
画像１＝画像URL１を画像読み待つ。
画像幅＝画像１の「幅」をDOM属性取得。
画像高さ＝画像１の「高さ」をDOM属性取得。
画像URL２＝『https://n3s.nadesi.com/image.php?f=389.png』
画像２＝画像URL２を画像読み待つ。
＃親ボックスの準備
母艦＝DOM親要素。# nako3_div
# 親ボックスのポジションを相対位置とし、幅と高さを設定
親ボックス＝「div」のDOM部品作成。
親ボックスに{
"position":"relative",
"幅":"{画像幅}px",
"高さ":"{画像高さ}px",
}をDOMスタイル一括設定。
親ボックスにDOM親要素設定。
＃キャンバス作成
# 作成するキャンバスは全てポジションを絶対位置にする
メインキャンバス＝[画像幅,画像高さ]のキャンバス作成。
メインキャンバスの「position」に「absolute」をDOMスタイル設定。
[0,0]へ画像１を画像描画。
＃操作用キャンバスでマウス位置の取得とガイドラインの表示
操作用キャンバス＝[画像幅,画像高さ]のキャンバス作成。
操作用キャンバスの「position」に「absolute」をDOMスタイル設定。
操作用キャンバスの「z-index」に「9999」をDOMスタイル設定。# 数が大きいほど上位
操作用キャンバスをマウス押した時には、
[マウスX,マウスY]を表示。
ここまで。
＃重ねるキャンバス
# あとからサブキャンバスを作っても、上位にある操作用キャンバスでマウス位置が取れます
サブキャンバス＝[画像幅,画像高さ]のキャンバス作成。
サブキャンバスの「position」に「absolute」をDOMスタイル設定。
[30,50]へ画像２を画像描画。
#------------------
2024-01-05 09:25:39
1815 : Re①:キャンバスを重ねて、特定のキャンバスのみ編集できませんか。
50行目/＃重ねるキャンバス
範囲選択時に選択位置が見えるようにガイドラインを出したいということですよね？
それは、キャンバスを重ねなくとも可能です。
#------------------
画像URL＝『https://n3s.nadesi.com/image.php?f=8.jpg』
元画像＝[0,0]へ画像URLを画像描画。
元画像の「幅」をDOM属性取得して、それを描画中キャンバスの「幅」にDOM属性設定。
元画像の「高さ」をDOM属性取得して、それを描画中キャンバスの「高さ」にDOM属性設定。
範囲選択中＝オフ。
開始X＝0。開始Y＝0。現在X＝0。現在Y＝0。
描画中キャンバスをマウス押した時には、
開始X＝マウスX。開始Y＝マウスY。
現在X＝開始X。現在Y＝開始Y。
範囲選択中＝オン。
[0,0]へ元画像を画像描画。
ここまで。
描画中キャンバスをマウス移動した時には、
もし、範囲選択中＝オフならば、戻る。
現在X＝マウスX。現在Y＝マウスY。
空に塗り色設定。灰色に線色設定。
[0,0]へ元画像を画像描画。
[開始X,開始Y,現在X-開始X,現在Y-開始Y]へ四角描画。
ここまで。
描画中キャンバスのマウス離した時には、
範囲選択中＝オフ。
ここまで。
#------------------
画像読むや画像描画をするとイメージオブジェクトが取得できるので、キャンバスに直接ガイドラインを引き、画像色取得する際は元画像を画像描画した状態で行えばＯＫなのです。
また、キャンバスを重ねてレイヤーを作ることも可能です。
ちょこっとCSSの知識が必要になります。
#-------------------
＃元のキャンバスは使わない
描画中キャンバスの「幅」に0をDOM属性設定。
描画中キャンバスの「高さ」に0をDOM属性設定。
＃画像準備
画像URL＝『https://n3s.nadesi.com/image.php?f=8.jpg』
元画像＝画像URLを画像読み待つ。
画像幅＝元画像の「幅」をDOM属性取得。
画像高さ＝元画像の「高さ」をDOM属性取得。
＃画像用キャンバス
メインキャンバス＝[画像幅,画像高さ]のキャンバス作成。
メインキャンバスの描画開始。
[0,0]へ元画像を画像描画。
＃重ねるキャンバス
サブキャンバス＝[画像幅,画像高さ]のキャンバス作成。
サブキャンバスに{
"position": "relative",//相対位置への配置
"左":"{-1*画像幅}px" //メインキャンバスの幅だけ左に
}をDOMスタイル一括設定
サブキャンバスの描画開始。
画像２＝『https://n3s.nadesi.com/image.php?f=1.jpg』
[0,0]へ画像２を画像描画。
#-------------------
元からあるキャンバスを使うと位置の指定がめんどくなるので、両方自分でキャンバス作成しています。
重ねる方のキャンバスに「position」の設定を行います。
「relative」は相対位置指定で、基準は位置指定せず普通に表示した時表示される場所が0,0になります。
普通に二枚キャンバスを作ると横に並んで作成されるので、メインキャンバスの幅だけマイナスしてやれば重なりますよ。
位置の指定はx,yではなくleftとtopです。DOM和スタイル、左はあるけど上はないんだよね～。
ピッタリ重なってるのを見るために、別の画像を描画しています。
2023-12-30 20:58:26
1807 : Re②:画像をputImageDataでまるっとキャンバスに表示する
19行目/ それを表示＃＃＃＃＃＃＃＃＃＃＃＃＃＃＃＃＃＃＃＃＃＃＃＃＃
ありがとうございます。
putimageDataと、getimageDataの謎については理解できました。
いま、この関数を使った最小単位のプログラムとして、画像を座標をずらして描画しようと考え、
以下のプログラムを書いたのですが、うまくいきませんでした。アドバイスいただけたらうれしいです。
色データ=0
処理範囲=[0,0,300,250]
[0,0]へ「https://n3s.nadesi.com/image.php?f=263.png」を画像描画
色データ＝処理範囲の色データ取得。
処理範囲を色データで画像処理反映。
●(xywhの|xywhを)色データ取得
描画中コンテキストの「getImageData」をxywhでJSメソッド実行して、それ["data"]で戻る。
それを表示
＃＃＃＃＃＃＃＃＃＃＃＃＃＃＃＃＃＃＃＃＃＃＃＃＃
ここまで。
●(xywhを色データで|xywhに)画像処理反映
「(function (color,ctx){波カッコ}
const img = ctx.getImageData({xywh});
let data = img.data;
for (let i=0; i
ctx.putImageData(img,{10}, {10});
{波カッコ閉じ})」を[色データ,描画中コンテキスト]でJS関数実行。
ここまで。
2023-12-30 13:53:27
1804 : 画像をputImageDataでまるっとキャンバスに表示する
4行目/（画像処理をするプログライン）を参考に、「＃色データの取得と設定」で書かれている関数を使って表示しようと思ったのですが、うまくいきませんでした。
画像をgetimageDataにて、一気に取得することができるようになり、取得に関しては、とても高速に処理できるようになりました。
ただ、putimageDataを使って、キャンバスに画像を表示する方法がわかりません。
https://n3s.nadesi.com/id.php?539
（画像処理をするプログライン）を参考に、「
＃色データの取得と設定」で書かれている関数を使って表示しようと思ったのですが、うまくいきませんでした。
「●(xywhの|xywhを)色データ取得」をつかって、キャンバスの画像データを取得して、その値を変更して、
「●(xywhを色データで|xywhに)画像処理反映」を使い、キャンバスに描画しているのはなんとなく わかりました。
けれど、その、「画像処理反映」の関数の中で、再度「getimageData」を使いキャンバスのデータを取得し直しているように見えて、
どういう動作をしているのかわかりませんでした。
この関数はどのように使えばよいのでしょうか。
また、できれば、「●(xywhを色データで|xywhに)画像処理反映」で、再度「getimageData」を利用する意味も教えてほしいです。
よろしくおねがいします。
2023-12-21 11:46:29
1793 : Re①:リストについて
34行目/＃ここまで
もともと、「リスト」は、設定されたアイテム(リスト)から選択して、テキスト値を取得するＧＵＩです。
2行目を選択すれば、2行目のテキストが取得されます。
[ボタン1]を押したら4を選択状態にするには、[リスト1]の値を3(4-1)に設定すれば、[リスト1]の４番目を選択できます。
その時の[リスト1]のアイテムを配列変数に取得して、配列変数[4-1]で取得すれば、[リスト1]の4番目のテキストが取得できます。
「1部の中身だけ選択不可能」は出来ないか、出来るとしても意図が分かりません。
リストにあるが選択出来なくしたければ、リスト作成時にリストに入れなければ良いだけだと思います。
もしくは、選択してもその行の処理は何もしない(テキスト取得しない)で、戻るようにプログラムするかです。
＃ここから
リスト1とはリスト
そのアイテムは「1 行目
2 行目
3 行目
4 行目
5 行目
」
そのクリックした時は
＃2行目以外は表示する
もし （自身→値）<>(2-1)ならば
自身→テキストを表示
ボタン1とはボタン
そのクリックした時は
リスト1の値は、4-1
＃リストの4行目の値は3
リスト一覧は、リスト1のアイテム
リスト一覧[リスト1の値]を表示
＃ここまで
■本文始まり■
リストについてなのですがボタンを押したら4を選択状態にするにはどうしたらいいのでしょうか
また、1部の中身だけ選択不可能にするにはどうしたらいいのでしょうか
リスト1とはリスト
そのアイテムは「1
2
3
4
5」
ボタン1とはボタン
そのクリックした時は
■本文終わり■
2023-12-20 17:41:40
1789 : Re①:画像幅が指定できない
70行目/＃ここまで
画像の縮小(リサイズ)には２種類あるようです。
一つ目は、イメージを画像リサイズして縮小する方法で、イメージ自体のサイズ(画素、画質)が変更されます。
元のサイズに拡大しても元に戻らないので、元の画質が必要な場合はイメージをコピーしてから画像リサイズする必要があります。
二つ目は、イメージの拡大機能を「オン」して、イメージの幅と高さを変更する方法で、イメージの表示のみが変更され元のサイス(画素、画質)は変更されないようです。
イメージの幅と高さを設定して自由に大きさを変更できますが、画像リサイズと比べて縮小表示された画質は悪化します。
どちらが良いかは、その時のイメージの扱いにより違って来ます。
＃ここから
母艦の可視はオフ
＃イメージ作成
キャプチャ用とはイメージ
表示用イメージとは、イメージ
＃デスクトップをキャプチャ
1秒待つ
キャプチャ用へ「デスクトップ」を窓キャプチャ
キャプチャ用のタグは「{キャプチャ用の幅},{キャプチャ用の高さ}」
画像比率は、キャプチャ用の高さ/キャプチャ用の幅
＃デスクトップの表示
母艦を最大化
母艦の可視はオン
画像幅は、母艦のクライアント幅
＃キャプチャ用画像を表示用イメージにコピー
表示用イメージの位置は、「10,10」
表示用イメージの幅は、キャプチャ用の幅
表示用イメージの高さは、キャプチャ用の幅*画像比率
キャプチャ用を表示用イメージの0,0へ画像コピー
＃表示用イメージを画像リサイズで縮小
表示用イメージを画像幅/2-15,画像幅/2*画像比率-15で画像リサイズ
表示用イメージの幅は、画像幅-15
表示用イメージの高さは、画像幅*画像比率-15
＃キャプチャ用を縮小表示
キャプチャ用の拡大機能は、オン
キャプチャ用の位置は、「{画像幅/2+10},10」
キャプチャ用の幅は、画像幅/2-15
キャプチャ用の高さは、画像幅/2*画像比率-15
＃メッセージ(一時停止)
「左側画像：キャプチャ用画像を画像リサイズした画像
右側画像：キャプチャ用画像を表示だけ縮小した画像
【ＯＫ】で、キャプチャ用画像(右側)を元に戻す」を言う
＃キャプチャ画像を元の大きさに戻す
キャプチャ用のサイズは「0,0,{キャプチャ用のタグ}」
キャプチャ用の拡大機能は、オフ
＃終了確認
＃メッセージ(一時停止)
「左側画像：キャプチャ用画像を画像リサイズした画像
裏側画像：キャプチャ用画像を元の大きさに戻した画像
【ＯＫ】で、終了します」を言う
終了
＃ここまで
■本文始まり■
キャプチャ用とはイメージ
そのWは120
そのHは50
キャプチャ用へ「デスクトップ」を窓キャプチャ
画像幅と高さが指定できません
アスペクト比を保ちながら縮小表示はどうやるのでしょうか
■本文終わり■
2023-11-13 11:32:29
1758 : Re②:マニュアルに「●」が無いようです。追加していただけませんか？
5行目/命令一覧にはコメント記号（//＃※）は載っていて、●や■や・が載っていないというのは、たしかに。
■本文始まり■
返信ありがとうございます。
命令一覧にはコメント記号（//
＃※）は載っていて、●や■や・が載っていないというのは、たしかに。
そうですね、まるだけではありませんね。昔はコメント開始記号も載ってなくて、要望してのっけてもらった経緯があります。
＞マニュアル目次＞機能編
＞■リンク■https://nadesi.com/doc/reference/index.htm
＞
＞にある基本文法 ・命令
＞■リンク■https://nadesi.com/doc/reference/syntax/1-3-command.htm＞
＞
＞引数や参照渡しの書き方が載っているのは、ここになります。
なるほど、リファレンスではなくて、マニュアルの方でしたか。たしかにどこかで説明を読んだ記憶はありました。
で、今回の趣旨は、命令一覧の
機能順 -- http://nadesi.com/doc/cmd-func.htm
50音順 -- http://nadesi.com/doc/cmd-kana.htm
の各頁から、「簡単に」調べることようになって欲しいと言うことです。どこかで見たけどなんだっけ、て時見るのは、索引ですよね？
ご理解いただければ幸いです。
■本文終わり■
2023-11-11 15:23:53
1755 : Re①:マニュアルに「●」が無いようです。追加していただけませんか？
12行目/命令一覧にはコメント記号（//＃※）は載っていて、●や■や・が載っていないというのは、たしかに。
■本文始まり■
久しぶりにプログラミングに戻ってナデシコ1を使わせていただいております。ユーザー関数の定義はどうだったっけと軽く確認しようとマニュアルを見ても、探し出せませんでした。過去に自分で作ったソースを見て思い出しましたが……。マニュアルで簡単にユーザー関数の定義が参照できるようにしていただけたら幸いです。五十音順では「●」で、機能別では「関数」か「ユーザー関数」か何かで項目が出ているといいなと思いました。
自分がわずかなりにも貢献しようとマニュアルに補足説明などを入れていたのも2009年、14年も前のことでした。もうマニュアル修正のページに入る方法も忘れてしまいました。その間にv3も出ているし、浦島太郎になってしまいましたが、v1が健在で今でも非常に有用なので助かります。
■本文終わり■
50音順のページのタイトルは「なでしこ命令一覧50音順」
なでしこエディタの左のタブにあるのを見ると、「命令一覧」「命令検索」
●で定義するのは「ユーザー定義命令」
「関数」じゃなくて「命令」だったのさ（そういう問題でもない）
命令一覧にはコメント記号（//
＃※）は載っていて、●や■や・が載っていないというのは、たしかに。
ワンランク上の文法という位置づけなのかな。
マニュアル目次＞機能編
■リンク■https://nadesi.com/doc/reference/index.htm
にある基本文法 ・命令
■リンク■https://nadesi.com/doc/reference/syntax/1-3-command.htm
引数や参照渡しの書き方が載っているのは、ここになります。
> > > 次へ
旧掲示板はこちら
www.eznavi.net