python：text()ウィジェット内の特定の文字に色をつけたい

発生した問題

こんにちは。
pythonにて、ネット上で見つけたソースコードを母体としてテキストエディタを作成しています。
主にhtml等を書くことを想定したものなので、Text()ウィジェット内に<html>や<body>等の所定の文字が記入された場合に、その文字に色をつけたいなと思っていましたが、どうしても上手くいきません。
###　試したこと
試しに、↓

python
1    text_widget.configure("<html>",fg="red")

のようにして見ましたが、失敗しました。
他にもいろいろ試し、全て失敗に終わりました。
どうか、これを解決する方法をご教授いただきたいと思います。

該当のソースコード

一応コードの全部分を載せておきます。

python
1# tkinterのインポート
2import tkinter
3import tkinter as tk
4import tkinter.ttk as ttk
5import tkinter.font as font
6from tkinter.filedialog import askopenfilename
7import os
8import ctypes
9try:
10    ctypes.windll.shcore.SetProcessDpiAwareness(True)
11except:
12    pass
13
14
15
16# rootメインウィンドウの設定
17root = tk.Tk()
18
19my_font = font.Font(root,family = "游ゴシック")
20
21def new_text():
22    import pathlib
23    file = pathlib.Path("./writed_file")
24    file.touch()
25
26def open_text():
27    typ = [('html Files', '*.html;*.css;*.js')]
28    filepath = askopenfilename(filetypes=typ)
29    if not filepath:
30        return
31    text_widget.delete('1.0', tkinter.END)
32    with open(filepath, "r", encoding="utf-8") as open_file:
33        text = open_file.read()
34        text_widget.insert(tkinter.END, text)
35    root.title(f'colony - {filepath}')
36
37def naming_file_save():
38    from tkinter.filedialog import asksaveasfilename
39    typ = [('html Files', '*.html;*.css;*.js')]
40    filepath = asksaveasfilename(defaultextension="txt",filetypes=typ)
41    if not filepath:
42        return
43    with open(filepath, "w") as save_file:
44        text = text_widget.get("1.0", tkinter.END)
45        save_file.write(text)
46    root.title(f"colony - {filepath}")
47
48
49def btn_click():
50    t1, t2 = txt_1.get(), txt_2.get()
51    if t1[-1] == '/':
52        pass
53    else:
54        t1 += '/'
55    file_pass = t1 + t2
56    text = text_widget.get('1.0','end -1c')
57    f = open(file_pass, 'w')
58    f.write(text)
59    f.close()
60
61def test():
62    print("test")
63
64def new_tab():
65    
66#メニューバー
67menubar = tkinter.Menu(root)
68filemenu = tkinter.Menu(menubar, tearoff=0)
69
70
71
72filemenu = tkinter.Menu(menubar, tearoff=0)
73filemenu.add_command(label = "新規(N)",command = new_text)
74filemenu.add_command(label = "開く(O)...",command = open_text)
75filemenu.add_command(label = "上書き保存(S)")
76filemenu.add_command(label = "名前を付けて保存(A)...",command = naming_file_save)
77filemenu.add_separator()
78filemenu.add_command(label = "colonyの終了(X)", command = root.destroy)
79
80
81menubar.add_cascade(label = "ファイル(F)", menu = filemenu)
82
83editmenu = tkinter.Menu(menubar, tearoff=0)
84editmenu.add_command(label = "NONE")
85
86formatmenu = tkinter.Menu(menubar, tearoff = 0)
87editmenu.add_command(label = "基本のjavascript形式(alt+I+J)")
88editmenu.add_command(label = "基本のcss形式(alt+I+c)")
89editmenu.add_command(label = "基本のhtml形式(alt+I+h)")
90editmenu.add_command(label = "写真の挿入(alt+I+p)")
91editmenu.add_command(label = "動画の挿入(alt+I+M)")
92filemenu.add_separator()
93
94menubar.add_cascade(label = "オート入力(I)", menu = editmenu)
95
96viewmenu = tkinter.Menu(menubar, tearoff = 0)
97viewmenu.add_command(label = "NONE")
98menubar.add_cascade(label = "表示(V)", menu = viewmenu)
99
100root.config(menu = menubar)
101
102
103# Notebookウィジェットの作成
104notebook = ttk.Notebook(root)
105
106# タブの作成
107tab_one = tk.Frame(notebook, bg='white')
108tab_two = tk.Frame(notebook, bg="white")
109
110# notebookにタブを追加
111notebook.add(tab_one, text="text")###ここが問題
112notebook.add(tab_two, text="tab2")
113
114# tab_oneに配置するウィジェットの作成
115text_widget = tk.Text(tab_one,wrap = tk.NONE,font = my_font,borderwidth = 1)
116text_widget.configure(fg="#3A4861")
117    text_widget.configure("<html>",fg="red")
118root.columnconfigure(0, weight = 1)
119root.rowconfigure(0, weight = 1)
120yscroll = ttk.Scrollbar(tab_one, command=text_widget.yview,orient=tk.VERTICAL)
121xscroll = ttk.Scrollbar(tab_one, command=text_widget.xview, orient=tk.HORIZONTAL)
122text_widget['yscrollcommand'] = yscroll.set
123text_widget['xscrollcommand'] = xscroll.set
124
125# ウィジェットの配置
126notebook.pack(expand=True, fill='both')
127text_widget.place(width=1900,height=928)
128yscroll.pack(side=tk.RIGHT, fill = "y")
129xscroll.pack(side=tk.BOTTOM, fill = "x")
130root.title("テスト")
131root.geometry("1500x750")
132root.state("zoomed")
133root.mainloop()

補足情報（FW/ツールのバージョンなど）

python ver.3.9
開発環境↓
atom エディタ
atom-runner

行動規範の内容に同意します

回答1件

タグ付けをして、タグ毎に色設定を行います。

text_widget.tag_config("TAG_NAME", foreground="red") config は最初に一度のみ設定
text_widget.insert(tk.END, "<html>", "TAG_NAME")

より細かい操作が必要な場合は、HTML文書をパースして
タグ名の位置を判別し、text_widget.tag_add("TAG_NAME", "1.1", "1.5") みたいに、
色を変えたい場所（例では 1行目1文字目～5文字目迄) を指定します。

HTML文書のパースには標準ライブラリの html.parser が利用できます。

投稿2021/07/18 10:52

編集2021/07/18 12:11

teamikl

総合スコア8664

退会済みユーザー

2021/07/18 12:04

回答有り難うございます。早速ソースコード内に組み込んで実行したところ、 TypeError: insert() got an unexpected keyword argument 'tag' というエラーが出てしまいました。(atom-runnerにて実行) このエラーは何なのでしょうか？お教えいただけると幸いです。m(_ _)m

teamikl

2021/07/18 12:14

回答を修正、記述ミスでした。キーワード引数ではなかったみたいです。

退会済みユーザー

2021/07/18 12:50 編集

実行してみたところ、無事動きました。ですが、自分の考える動作とは少し違いがありまして、(本当にすみません。。) 質問欄の｢試したこと｣に、とても的外れなコードを書いてしまいました。あのコードは以降は無視してください。正しくは、例Text()に<html>と記述されたら、この記述された「<html>」の文字色を赤にするというものです。文章が上手くまとまっておらず、理解しづらいかもしれません。何回もすみません<(_ _)>

teamikl

2021/07/18 13:54 編集

「Text()に<html>と記述されたら」というのは、テキスト欄にユーザが入力したタイミングですか？それとも、プログラム・ソースコードに記述したらという意図でしょうか。エディタのハイライト機能を実装したいのであれば、「キー入力イベント」で、「テキスト内容を解析し」て、「色付したい位置にタグ付け」、という流れで実装します。リアルタイムに反映させたい場合は、もう少し実装が難しくなりキー入力は連続して起こるので、大抵の場合はタイマーを使い、色付処理を呼び出します。キー入力が連続した場合中断して再度色付を行うといった感じです。

退会済みユーザー

2021/07/19 07:14

こんにちは。自分が思い描いている動作は前者の方です。説明不足で申し訳ありません。

teamikl

2021/07/19 08:59 編集

前者であれば、上述したように - キー入力があったタイミングで、bind("<Key>", ...) 等 - テキスト解析 html.parser で、タグの開始・終了位置を調べる - 色情報を更新(タグ付け) tag_remove, tag_add といった流れで処理します。分量のある内容なので、詳細まで説明することは出来ませんが、一つ一つ調べてみて下さい。もし、質問の意図が、自分で実装するのではなく、そのような機能が備わっていないか、簡単な方法を探しているのでしたら、自分の知る限りでは tkinter ではサポートされてません。外部ライブラリであるかどうかは未調査。参考: 実際のアプリケーションでの実装例 - https://github.com/JamesStallings/pyro/blob/master/pyro 　保守されてないので、コードは少し手直ししないと実行できませんが　　 (typo: eventmouse -> event_mouse) 　tkinter + 色付で探して見つかった比較的簡単そうなサンプルコードです。　要点は、event_key と recolorize 　テキストの構文解析は pygments というライブラリを用いてHTML 以外の色付けにも対応してます。　但し、この実装方法では問題が有り。キーが押させる度に毎回テキストを全文解析する為、　巨大なファイルを編集する時に、動作が重くなりやすい傾向があります。 - https://github.com/python/cpython/blob/main/Lib/idlelib/colorizer.py 　HTMLでは有りませんが、標準ライブラリ内 IDLE でのシンタックスハイライトの実装。　必要な範囲のみ更新するように効率化されてます。が、実装難易度は高くなります。　テキストバッファの管理方法等、より専門的な知識が必要な内容になってきます。

退会済みユーザー

2021/07/19 10:55

有り難うございます。しばらく模索してみます。

行動規範の内容に同意します