画像クリックの方法について

皆様からのご教授お願いできればと思います。

下記のような画像があり線に沿って自動化しクリックしたいと思います。外部アプリでの連携。(photoshopのペンツールで範囲指定のイメージです。)

%E2%91%A1

【個人的に試してみたこと。】
①A1という場所を画像クリックをし、座標をvb.netでのマウスカーソルXY座標を取得。
⇒System.Windows.Forms.Cursor.Position.X と System.Windows.Forms.Cursor.Position.Y でXY座標を取得
②ColorDetectorActivitiesというアクティビティで色の判定。
⇒RGBの判定をするアクティビティ。出力は文字「White」「Black」など
③A1画像クリックのオフセット(XY座標の値)を1つずつカウントアップさせ、色の判定で「Black」となったらクリック

備考:escキーでその外部アプリのクリックは取り消せる。最終的に二番目の画像のように五回のみクリックをする。最初の文字画像のクリックの後はホットキーで「esc」を入れる。

【個人的にやったことでの問題点】
・画像クリックA1という文字の中心あたりから取得するため、文字に重なった場合は色の判定で「Black」となる。
・画像クリックA1という文字の場所をオフセットでずらして、取得することも検討したが、A1とB1の境界線が近い場合想定もあり飛び越える可能性あり。

こういった人間が行うことに関してはUipthでは不向きということは重々承知ですが
なにかいい方法などございませんでしょうか。
何卒、よろしくお願い申し上げます。

こんにちは

色の変化を検知した瞬間にクリックするのではなく、
色の変化を検知した後も暫く隣のピクセルの色情報を取得していき、例えば10ピクセル連続でその色が続いたら、変化した地点がクリックすべき点とすればよいのでは?と思います。
(その文字情報次第ですが。続かなければ改めて隣のピクセルをとりに行く)

あと画像の大きさにもよりますが、パフォーマンスに課題があるようでしたら、対象画像全体をBitmapとして取得し、それをbyte配列に変換してから処理した方が良いかもしれません。(変換とかちょっと面倒ですがパフォーマンスは高くなります。)

可能であれば、文字と線の色を変えるという方法もあります。
見た目どちらも黒でないといけないとしても、視覚的にわからない程度の色差でもRGB値としては差を検知できます。

早速のご返答、ありがとうございます!

下記の件、私も考えたものの、文字情報や文字情報と境界線が密接した場合は難しくなりまして。。

色の変化を検知した後も暫く隣のピクセルの色情報を取得していき、
例えば10ピクセル連続でその色が続いたら、変化した地点がクリックすべき点とすればよいのでは?と思います。(その文字情報次第ですが。続かなければ改めて隣のピクセルをとりに行く)

こちらにつきまして、もし可能でしたら、やり方についてご教授いただけませんか。

対象画像全体をBitmapとして取得し、それをbyte配列に変換してから処理した方が良いかもしれません。(変換とかちょっと面倒ですがパフォーマンスは高くなります。)

※後だしの補足となり、恐縮ですが
クリックするのは外部アプリ上でのクリックとなります。
外部アプリがファイルを読み込み表示。そこから、囲むようにクリックがしたいといった感じです。また、A1の長方形のパターン長さの変更あります。

何卒、よろしくお願いいたします。

ご回答ありがとうございます。

文字の色の変更が難しく、またColorDetectorActivitiesというアクティビティでは
RGBを判断した結果文字として「white」「black」といった色を英語で出力するものでして、カラーのRGB値を出すものではありませんでした。

RGBの値を判断できるアクティビティなどご存知でしたら、ご教授いただければ幸いです。

何卒、よろしくお願いいたします。

こんにちは

もう少し具体的な画像イメージがあるとコメントしやすいのですが...

文字情報や文字情報と境界線が密接した場合は難しくなりまして。。

こちらにつきまして、もし可能でしたら、やり方についてご教授いただけませんか

例えばA1の部分は黒線で囲まれているのでしょうか?
もしそうであれば、例えば以下のような感じかと思います。
1.「A1」の文字周辺からスタート
2.右隣のピクセルのカラーを取得
3.カラーが黒なら以下の処理、違うなら2に戻る。
4.現在の座標値を一旦保持
5.上隣のピクセルのカラーを取得
6.カラーが黒なら別で用意したカウンターを加算
7. カウンターが例えば10になれば黒線と判断して4で取得した座標をクリック
8 黒の場合は5に戻りさらに上隣を取得する
9. もし黒ではなければ、線ではなく文字部と判断して2に戻る。

※後だしの補足となり、恐縮ですが
クリックするのは外部アプリ上でのクリックとなります。
外部アプリがファイルを読み込み表示。そこから、囲むようにクリックがしたいといった感じです。また、A1の長方形のパターン長さの変更あります。

UiPath側で所定の要素の範囲を画像として取得できるTakeScreenShotアクティビティがありますので、こちらを使って画面からBitmap→byte配列を取得できます。
Bitmapやbyte配列になると基本的にはRGB値を扱うことになります。

@sato_0024

これ参考になりませんか?
https://uipath.site/blog/paint.html

確か画像のRGB値から座標をとって、MSペイントにRGB値が閾値以上だったらクリックして絵を描いていく、というプログラムだったはずなので、同じ考え方が使える気がします。

@sato_0024
文字の色の変更が難しいのであれば、A1文字除外ロジックが必須となるってしまうのでそこが難しいですね。

RGBの値を判断できるアクティビティは、UiPathTeam.GetPixelsFromImage.Activitiesが使えそうです。
ファイルまたは Imageオブジェクトを指定すると、Color構造体(ARGB)が配列で取得できるようです。

Color構造体

@sato_0024
もし対象の画像が質問にあるような画像と酷似しているのであれば、文字にはアンチエイリアスがかかって グレーとして判定できるので、それでまずA1文字範囲を確定すればいいのではと。
懸念としては、1という文字の縦線と下横線がうまく判定できるかかな・・・

ありがとうございます。

こちら、一度拝見させて頂きます!

ありがとうございます。

こういうアクティビティがあるのですね!こちら一度試してみたいと思います!

除外のロジックの考え方もあるのですね。こちらは盲点でした。
除外ロジック 少し調査してみたいと思います。 なにかご存知でしたら、たびたび申し訳ないのですが、ご教授いただければ幸いです。

ありがとうございます!

あと、説明が下手で大変申し訳ございません。

文字と境界線が密接というのは下記のパターンです。(公図をイメージしてもらえればと思います。)
_forn
⇒文字と境界線の近さが同じ程度のパターン

下記の件はおっしゃるとおりです。説明が下手で申し訳ありません。赤線がフローという意味で記載しておりました。

例えばA1の部分は黒線で囲まれているのでしょうか?

下記の件、ありがとうございます。こちら参考にさせていただきます。

UiPath側で所定の要素の範囲を画像として取得できるTakeScreenShotアクティビティがありますので、こちらを使って画面からBitmap→byte配列を取得できます。
Bitmapやbyte配列になると基本的にはRGB値を扱うことになります。

@sato_0024

(線が真っ黒ならば)
・クリックした位置を中心に上下左右30botくらいの範囲で、グレー(白と真っ黒以外)の左端、上端、下端をサーチ(図の赤枠)
(Aは必ずアンチエイリアスがかかるが、1の色が微妙なので右端はサーチしない)
・左端の16dot(?)右を右端とする。(オレンジ矢印)
・1dot隙間を開けて、上下左右に黒をサーチ(水色矢印)
こんな感じかな・・・(数値は適宜調整してください)

c74