[PYTHON] Ein Skript, mit dem Sie mit der LINE Messaging-API auf einfache Weise umfangreiche Menüs erstellen können
Überblick
Wenn Sie das Rich-Menü über die Messaging-API festlegen, können Sie es sehr flexibel einstellen und bis zu 20 Schaltflächen einrichten. Es ist jedoch lächerlich mühsam, Json dazu zu bringen, es einzustellen, deshalb habe ich ein Skript geschrieben, das leicht eingestellt werden kann.
Zum Beispiel, wenn Sie ein Bild wie dieses haben Wenn Sie jedem Kreis acht Schaltflächen zuweisen, ist es zu mühsam, die Koordinaten, die Höhe und die Breite herauszufinden.
Schritt 1
Erstellen Sie zunächst ein Originalbild mit einer Größe von 2500 x 1686 für das umfangreiche Menü. Es ist in Ordnung, wenn es sich nur um eine einfache Figur wie dieses Bild handelt, aber es ist nicht möglich, komplizierte Figuren wie Fotos und Zeichen zu erkennen. Daher ist es eine gute Idee, einzelne Bilder zu erstellen, die nur den Teil hervorheben, für den Sie eine Schaltfläche erstellen möchten.
Nennen wir das Bild, in dem der Schaltflächenteil leicht zu verstehen ist, "sample.png "
Schritt 2
Füttere das Skript.
$ python menu_gen.py sample.png
Das Skript sieht so aus.
menu_gen.py
import cv2
import json
import collections as cl
import codecs
import sys
def main():
args = sys.argv
file_name = args[1]
img_color = cv2.imread(file_name) #Originalbild importieren
img_gray = cv2.imread(file_name, cv2.IMREAD_GRAYSCALE) #Bild in Graustufen importieren
ret, img_binary = cv2.threshold(img_gray, 250, 255, cv2.THRESH_BINARY_INV) #Graustufenbilder binarisieren
contours, hierarchy = cv2.findContours(img_binary, cv2.RETR_EXTERNAL, cv2.CHAIN_APPROX_SIMPLE) #Konturextraktion
#cv2.drawContours(img_color, contours, -1, (0,0,255), 2) #Zeichnen Sie rot auf die Kontur
print(len(contours),"ich habe einen gefunden") #Anzahl der Konturen
rich_menu_json = cl.OrderedDict()
rich_menu_json["size"] = {"width": 2500, "height": 1686}
rich_menu_json["selected"] = "true"
rich_menu_json["name"] = file_name
rich_menu_json["chatBarText"] = 'Speisekarte'
rich_menu_json["areas"] = []
for i, c in enumerate(contours):
x,y,w,h = cv2.boundingRect(c) #Rechteckiges Urteil
# print("["+str(i)+"]",x,y,w,h)
img_color = cv2.rectangle(img_color, (x,y), (x+w, y+h), (255,0,0), 3)
img_color = cv2.putText(img_color, "b_"+str(i), (x+int(w/3),y+int(h/2)), cv2.FONT_HERSHEY_SIMPLEX, 4, (255,255,255), 2, cv2.LINE_AA)
tmp = cl.OrderedDict()
tmp["bounds"] = {
"x": x,
"y": y,
"width": w,
"height": h
}
tmp["action"] = {
"type": "postback",
"label": "b_"+str(i),
"data": "{ }",
"displayText": str(i)
}
rich_menu_json["areas"].append(tmp)
fw = codecs.open(file_name.split('.')[0]+"_created_.json", 'w', "utf-8")
json.dump(rich_menu_json, fw, indent=4, ensure_ascii=False)
print('''
Erstellen Sie ein reichhaltiges Menü mit den folgenden Inhalten
curl -v -X POST https://api.line.me/v2/bot/richmenu \\
-H 'Authorization: Bearer {Zugangstoken}' \\
-H 'Content-Type: application/json' \\
-d \\
'
Fügen Sie hier den bearbeiteten Json ein
'
''')
cv2.imwrite(file_name.split('.')[0]+"_created_.jpg ", img_color)
cv2.imshow("window", img_color)
cv2.waitKey()
cv2.destroyAllWindows()
if __name__ == '__main__':
main()
Dann wird ein Bild mit einer Beschriftung für jede Schaltfläche wie "b_1" wie folgt erzeugt.
Gleichzeitig wird `` `sample_created.json``` aus den Informationen von Koordinaten, Höhe und Breite erstellt.
Es sieht wie folgt aus
{
"size": {
"width": 2500,
"height": 1686
},
"selected": "true",
"name": "sample.png ",
"chatBarText": "Speisekarte",
"areas": [
{
"bounds": {
"x": 91,
"y": 1131,
"width": 407,
"height": 407
},
"action": {
"type": "postback",
"label": "b_0",
"data": "{ }",
"displayText": "0"
}
},
{
"bounds": {
"x": 2002,
"y": 1130,
"width": 407,
"height": 407
},
"action": {
"type": "postback",
"label": "b_1",
"data": "{ }",
"displayText": "1"
}
},
{
"bounds": {
"x": 1047,
"y": 1130,
"width": 406,
"height": 407
},
"action": {
"type": "postback",
"label": "b_2",
"data": "{ }",
"displayText": "2"
}
},
{
"bounds": {
"x": 1534,
"y": 640,
"width": 407,
"height": 407
},
"action": {
"type": "postback",
"label": "b_3",
"data": "{ }",
"displayText": "3"
}
},
{
"bounds": {
"x": 559,
"y": 639,
"width": 407,
"height": 407
},
"action": {
"type": "postback",
"label": "b_4",
"data": "{ }",
"displayText": "4"
}
},
{
"bounds": {
"x": 1047,
"y": 149,
"width": 406,
"height": 407
},
"action": {
"type": "postback",
"label": "b_5",
"data": "{ }",
"displayText": "5"
}
},
{
"bounds": {
"x": 91,
"y": 149,
"width": 407,
"height": 407
},
"action": {
"type": "postback",
"label": "b_6",
"data": "{ }",
"displayText": "6"
}
},
{
"bounds": {
"x": 2002,
"y": 148,
"width": 407,
"height": 407
},
"action": {
"type": "postback",
"label": "b_7",
"data": "{ }",
"displayText": "7"
}
}
]
}
Derzeit ist es im Postback-Format, aber es scheint, dass Sie Zeit sparen können, indem Sie den Inhalt ausfüllen und den Inhalt hier mit dem Bild vergleichen.
Es ist eine grobe Erklärung, aber wenn es jemandem hilft.
Recommended Posts