<!DOCTYPE html>
    <html lang="vi" xmlns="http://www.w3.org/1999/xhtml" prefix="og: http://ogp.me/ns#">
    <head>
<title>Xây dựng một game màu sắc bằng Tkinter trong Python</title>
<meta name="description" content="Xây dựng một game màu sắc bằng Tkinter trong Python - Savefile - Tin Tức -...">
<meta name="author" content=".: Nguoicodonvn2008.info - Cõi lòng người cô đơn :.">
<meta name="copyright" content=".: Nguoicodonvn2008.info - Cõi lòng người cô đơn :. [admin@nguoicodonvn2008.info]">
<meta name="robots" content="index, archive, follow, noodp">
<meta name="googlebot" content="index,archive,follow,noodp">
<meta name="msnbot" content="all,index,follow">
<meta name="generator" content="NukeViet v4.5">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<meta property="og:title" content="Xây dựng một game màu sắc bằng Tkinter trong Python">
<meta property="og:type" content="website">
<meta property="og:description" content="Savefile - Tin Tức - https&#x3A;&#x002F;&#x002F;www.nguoicodonvn2008.info&#x002F;vi&#x002F;news&#x002F;savefile&#x002F;kien-thuc-may-tinh&#x002F;xay-dung-mot-game-mau-sac-bang-tkinter-trong-python-6770.html">
<meta property="og:site_name" content=".&#x3A; Nguoicodonvn2008.info - Cõi lòng người cô đơn &#x3A;.">
<meta property="og:url" content="https://www.nguoicodonvn2008.info/vi/news/savefile/kien-thuc-may-tinh/xay-dung-mot-game-mau-sac-bang-tkinter-trong-python-6770.html">
<link rel="shortcut icon" href="https://nguoicodonvn2008.info/favicon.ico">
<link rel="canonical" href="https://www.nguoicodonvn2008.info/vi/news/savefile/kien-thuc-may-tinh/xay-dung-mot-game-mau-sac-bang-tkinter-trong-python-6770.html">
<link rel="alternate" href="https://nguoicodonvn2008.info/vi/news/rss/" title="Tin Tức" type="application/rss+xml">
<link rel="alternate" href="https://nguoicodonvn2008.info/vi/news/rss/karaoke-dual/" title="Tin Tức - Karaoke Dual" type="application/rss+xml">
<link rel="alternate" href="https://nguoicodonvn2008.info/vi/news/rss/nhac-tre/" title="Tin Tức - Nhạc trẻ" type="application/rss+xml">
<link rel="alternate" href="https://nguoicodonvn2008.info/vi/news/rss/tru-tinh/" title="Tin Tức - Trữ tình" type="application/rss+xml">
<link rel="alternate" href="https://nguoicodonvn2008.info/vi/news/rss/nuoc-ngoai/" title="Tin Tức - Nước ngoài" type="application/rss+xml">
<link rel="alternate" href="https://nguoicodonvn2008.info/vi/news/rss/remix/" title="Tin Tức - Remix" type="application/rss+xml">
<link rel="alternate" href="https://nguoicodonvn2008.info/vi/news/rss/tam-su-tinh-yeu/" title="Tin Tức - Tâm sự tình yêu" type="application/rss+xml">
<link rel="alternate" href="https://nguoicodonvn2008.info/vi/news/rss/tho-suu-tam/" title="Tin Tức - Thơ sưu tầm" type="application/rss+xml">
<link rel="alternate" href="https://nguoicodonvn2008.info/vi/news/rss/cuoc-song/" title="Tin Tức - Cuộc sống" type="application/rss+xml">
<link rel="alternate" href="https://nguoicodonvn2008.info/vi/news/rss/phan-mem/" title="Tin Tức - Phần mềm" type="application/rss+xml">
<link rel="alternate" href="https://nguoicodonvn2008.info/vi/news/rss/kien-thuc-may-tinh/" title="Tin Tức - Kiến thức máy tính" type="application/rss+xml">
<link rel="alternate" href="https://nguoicodonvn2008.info/vi/news/rss/hoc-tap/" title="Tin Tức - Học tập" type="application/rss+xml">
<link rel="alternate" href="https://nguoicodonvn2008.info/vi/news/rss/tai-lieu/" title="Tin Tức - Tài liệu" type="application/rss+xml">
<link rel="alternate" href="https://nguoicodonvn2008.info/vi/news/rss/de-thi/" title="Tin Tức - Đề thi" type="application/rss+xml">
<link rel="preload" as="style" href="https://nguoicodonvn2008.info/assets/css/font-awesome.min.css" type="text/css">
<link rel="preload" as="style" href="https://nguoicodonvn2008.info/themes/default/css/bootstrap.non-responsive.css" type="text/css">
<link rel="preload" as="style" href="https://nguoicodonvn2008.info/themes/default/css/style.css" type="text/css">
<link rel="preload" as="style" href="https://nguoicodonvn2008.info/themes/default/css/style.non-responsive.css" type="text/css">
<link rel="preload" as="style" href="https://nguoicodonvn2008.info/themes/default/css/news.css" type="text/css">
<link rel="preload" as="style" href="https://nguoicodonvn2008.info/themes/default/css/custom.css" type="text/css">
<link rel="preload" as="script" href="https://nguoicodonvn2008.info/assets/js/jquery/jquery.min.js" type="text/javascript">
<link rel="preload" as="script" href="https://nguoicodonvn2008.info/assets/js/language/vi.js" type="text/javascript">
<link rel="preload" as="script" href="https://nguoicodonvn2008.info/assets/js/DOMPurify/purify3.js" type="text/javascript">
<link rel="preload" as="script" href="https://nguoicodonvn2008.info/assets/js/global.js" type="text/javascript">
<link rel="preload" as="script" href="https://nguoicodonvn2008.info/assets/js/site.js" type="text/javascript">
<link rel="preload" as="script" href="https://nguoicodonvn2008.info/themes/default/js/news.js" type="text/javascript">
<link rel="preload" as="script" href="https://nguoicodonvn2008.info/themes/default/js/main.js" type="text/javascript">
<link rel="preload" as="script" href="https://nguoicodonvn2008.info/themes/default/js/custom.js" type="text/javascript">
<link rel="preload" as="script" href="https://nguoicodonvn2008.info/themes/default/js/bootstrap.min.js" type="text/javascript">
<link rel="stylesheet" href="https://nguoicodonvn2008.info/assets/css/font-awesome.min.css">
<link rel="stylesheet" href="https://nguoicodonvn2008.info/themes/default/css/bootstrap.non-responsive.css">
<link rel="stylesheet" href="https://nguoicodonvn2008.info/themes/default/css/style.css">
<link rel="stylesheet" href="https://nguoicodonvn2008.info/themes/default/css/style.non-responsive.css">
<link rel="StyleSheet" href="https://nguoicodonvn2008.info/themes/default/css/news.css">
<link rel="stylesheet" href="https://nguoicodonvn2008.info/themes/default/css/custom.css">
<style type="text/css">
	body{background: #fff;}
</style>
    </head>
    <body>
<div id="print">
	<div id="hd_print">
		<h2 class="pull-left">.&#x3A; Nguoicodonvn2008.info - Cõi lòng người cô đơn &#x3A;.</h2>
		<p class="pull-right"><a title=".&#x3A; Nguoicodonvn2008.info - Cõi lòng người cô đơn &#x3A;." href="https://nguoicodonvn2008.info/">https://nguoicodonvn2008.info</a></p>
	</div>
	<div class="clear"></div>
	<hr />
	<div id="content">
		<h1>Xây dựng một game màu sắc bằng Tkinter trong Python</h1>
		<ul class="list-inline">
			<li>Thứ ba - 21/02/2023 23:56</li>
			<li class="hidden-print txtrequired"><em class="fa fa-print">&nbsp;</em><a title="In ra" href="javascript:;" onclick="window.print()">In ra</a></li>
			<li class="hidden-print txtrequired"><em class="fa fa-power-off">&nbsp;</em><a title="Đóng cửa sổ này" href="javascript:;" onclick="window.close()">Đóng cửa sổ này</a></li>
		</ul>
		<div class="clear"></div>
		<div id="hometext">
		</div>
				<div class="imghome">
			<img alt="Xây dựng một game màu sắc bằng Tkinter trong Python" src="https://st.quantrimang.com/photos/image/2023/02/22/python-man-hinh-game.jpg" width="460" class="img-thumbnail" />
		</div>
		<div class="clear"></div>
		<div id="bodytext" class="clearfix">
			<p style="text-align: justify;">Bạn có thể<strong>&nbsp;lập trình mini-game bằng Python&nbsp;</strong>theo cách vô cùng đơn giản. Dưới đây là&nbsp;<strong>cách tạo một game đố vui về màu sắc bằng Tkinter trong Python</strong>.</p>

<p style="text-align: justify;"><img alt="Game màu sắc bằng Python" data-i="0" data-src="https://st.quantrimang.com/photos/image/2023/02/22/Python-tao-game-7.jpg" data-was-processed="true" height="340" src="https://st.quantrimang.com/photos/image/2023/02/22/Python-tao-game-7.jpg" width="650" /></p>

<p style="text-align: justify;">Battlefield2, World of Tanks, The Sims4 và Freedom Force là một vài trong số hàng nghìn game hấp dẫn được lập trình bằng Python.</p>

<p style="text-align: justify;">Tkinter, giao diện Python chuẩn cho toolkit Tk GUI, là một mô đun mạnh mẽ, khiến việc tạo giao diện người dùng đồ họa dễ dàng và thú vị. Dùng mô đun này, bạn có thể phát triển một Color Game - game đố vui tiếng Anh về màu sắc.</p>

<h2 style="text-align: justify;">Color Game là gì?</h2>

<p style="text-align: justify;">Trong Color Game, chương trình này hiện tên của một màu sắc trên màn hình nhưng bằng một màu font khác. Ví dụ, nó hiện từ&nbsp;<strong>Yellow&nbsp;</strong>bằng màu font đỏ, người chơi phải nhập đúng tên màu của văn bản vào trường tương ứng.</p>

<p style="text-align: justify;">Thông tin sai lệch cùng với đồng hồ bấm giờ là nhân tố gây nhiễu, đồng thời tạo ra trải nghiệm chơi có tính giải trí cao.</p>

<h2 style="text-align: justify;">Mô đun Tkinter và Random</h2>

<p style="text-align: justify;">Để xây dựng Color Game, bạn sẽ dùng mô đun tkinter và random. Tkinter là một mô đun GUI thân thiện người dùng, đơn giản và chéo nền tảng mà bạn có thể dùng để tạo giao diện người dùng đồ họa thật nhanh.</p>

<p style="text-align: justify;">Nó có một số công cụ hữu ích như widget label, entry và trình quản lý bố cụ như pack, grid và place. Các hàm được cung cấp khá đơn giản, tới mức người mới lập trình cũng có thể thiết kế ứng dụng mà không tốn nhiều công sức. Để cài đặt tkinter trong hệ thống, chạy lệnh sau trong terminal:</p>

<pre id="pre0">
<code>pip install tkinter</code></pre>

<p style="text-align: justify;">Mô đun ngẫu nhiên là một thư viện được tích hợp mà bạn có thể tạo ra các lựa chọn ngẫu nhiên. Dùng mô đun này, bạn có thể phát triển game đoán số, trình tạo mật khẩu ngẫu nhiên và nhiều hơn thế nữa.</p>

<h2 style="text-align: justify;">Cách tạo game đố màu bằng Python</h2>

<p style="text-align: justify;">Bắt đầu bằng cách nhập tkinter và mô đun ngẫu nhiên. Lưu trữ tên của màu sắc dưới dạng danh sách các chuỗi và khởi tạo biến score sang&nbsp;<strong>0&nbsp;</strong>và&nbsp;<strong>time_remaining&nbsp;</strong>sang&nbsp;<strong>60</strong>.</p>

<pre id="pre1" style="text-align: justify;">
from tkinter import *
import random

colours = &#91;&#039;Red&#039;, &#039;Green&#039;, &#039;Blue&#039;, &#039;Black&#039;, &#039;Pink&#039;, &#039;White&#039;, &#039;Purple&#039;, &#039;Yellow&#039;, &#039;Brown&#039;&#93;
score = 0
time_remaining = 60</pre>

<p style="text-align: justify;">Xác định hàm&nbsp;<strong>beginGame()</strong>, lấy<strong>&nbsp;event&nbsp;</strong>làm đối số nhập vào. Hàm này triển khai hai nhiệm vụ. Đầu tiên, nó kiểm tra xem liệu time_remaining có bằng 60 hay không. Nếu đúng, nó gọi và chạy hàm countdown(). Thứ hai, nó gọi hàm&nbsp;<strong>nextcolor()</strong>&nbsp;xáo trộn ngẫu nhiên và hiện màu sắc cũng như điểm số khi game đang chạy.</p>

<pre id="pre2" style="text-align: justify;">
def beginGame(event):
    if time_remaining == 60:
        countdown()
    nextColour()</pre>

<p style="text-align: justify;">Xác định một hàm&nbsp;<strong>nextColour()&nbsp;</strong>và tham chiếu biến toàn cầu. Nếu thời gian còn lại lớn hơn 0, thiết lập mục tiêu trên trường nhập bằng&nbsp;<strong>focus_set()</strong>&nbsp;trên label mục nhập (được lưu trong biến&nbsp;<strong>e</strong>). Nó sẽ được xác định ở nửa sau của mã.</p>

<p style="text-align: justify;">Dùng hàm&nbsp;<strong>get()&nbsp;</strong>để trích xuất văn bản hiện tại của entry dưới dạng chuỗi và chuyển nó thành chữ viết thường để tránh trường hợp không trùng khớp. Nếu giá trị này bằng màu hiện trên màn hình, hãy tăng điểm lên một. Dùng hàm&nbsp;<strong>delete()</strong>&nbsp;từ&nbsp;<strong>0</strong>&nbsp;tới chỉ mục cuối cùng trên widget entry để làm rõ nội dung.</p>

<pre id="pre3" style="text-align: justify;">
def nextColour():
    global score
    global time_remaining
    if time_remaining &gt; 0:
        e.focus_set()
        if e.get().lower() == colours&#91;1&#93;.lower():
            score += 1
        e.delete(0, END)</pre>

<p style="text-align: justify;">Dùng hàm&nbsp;<strong>shuffle()</strong>&nbsp;để sắp xếp lại các mục trong danh sách và hiện nhãn màu kèm text dưới dạng màu đầu tiên trong danh sách này và màu font là màu thứ hai trong danh sách. Dùng hàm&nbsp;<strong>config()</strong>&nbsp;trên&nbsp;<strong>scoreLabel</strong>&nbsp;(yêu cầu nhấn&nbsp;<strong>Enter</strong>) để hiện điểm số khi chơi game.</p>

<pre id="pre4" style="text-align: justify;">
        random.shuffle(colours)
        label.config(fg=str(colours&#91;1&#93;), text=str(colours&#91;0&#93;))
        scoreLabel.config(text=&quot;Score: &quot; + str(score))</pre>

<p style="text-align: justify;">Xác định một hàm mang tên&nbsp;<strong>countdown()</strong>&nbsp;tham chiếu thời gian còn lại và giảm 1 cho nó. Dùng hàm&nbsp;<strong>config()</strong>&nbsp;trên&nbsp;<strong>timeLabel&nbsp;</strong>để hiện thời gian còn lại trên màn hình và hàm after() để gọi lại hàm countdown sau khi trì hoãn 1000 mili giây hoặc một giây.</p>

<pre id="pre5" style="text-align: justify;">
def countdown():
    global time_remaining
    if time_remaining &gt; 0:
        time_remaining -= 1
        timeLabel.config(text=&quot;Time left: &quot; + str(time_remaining))
        timeLabel.after(1000, countdown)</pre>

<p style="text-align: justify;">Khởi tạo phiên bản tkinter và hiện cửa sổ gốc. Đặt tiêu đề, kích thước theo pixel và màu nền của cửa sổ.</p>

<pre id="pre6" style="text-align: justify;">
root = Tk()
root.title(&quot;Color Game With a Twist&quot;)
root.geometry(&quot;750x450&quot;)
root.configure(background=&#039;Orange&#039;)</pre>

<p style="text-align: justify;">Dùng widget&nbsp;<strong>Label</strong>&nbsp;để dẫn người chơi tới phần hướng dẫn game. Nó chấp nhận cửa sổ chính mà bạn sẽ đặt nó. Text này sẽ hiện kiểu font và kích thước cùng với màu nền của nhãn. Dùng hàm&nbsp;<strong>pack()</strong>&nbsp;để sắp xếp lại widget label thành các khối trước khi đặt chúng vào widget chính.</p>

<p style="text-align: justify;">Tương tự, xác định nhãn score để hướng dẫn người dùng nhấn&nbsp;<strong>Enter</strong>&nbsp;khởi động game, còn nhãn time để hiện thời gian còn lại. Đảm bảo tất cả các nhãn đều có màu nền vàng cam để chúng hòa vào nền. Xác định một nhãn trống sẽ chứa các tên màu trong hàm&nbsp;<strong>nextColour()</strong>.</p>

<pre id="pre7" style="text-align: justify;">
instructions = Label(root, text=&quot;Type the colour of the word not the text ;)&quot;, font=(&#039;Arial&#039;, 24), bg=&quot;orange&quot;)
instructions.pack()
scoreLabel = Label(root, text=&quot;Press Enter to begin&quot;, font=(&#039;Arial&#039;, 24), bg=&quot;orange&quot;)
scoreLabel.pack()
timeLabel = Label(root, text=&quot;Time remaining: &quot; + str(time_remaining), font=(&#039;Arial&#039;, 24), bg=&quot;orange&quot;)
timeLabel.pack()
label = Label(root, font=(&#039;Arial&#039;, 90), bg=&quot;orange&quot;)</pre>

<p style="text-align: justify;">Như đã đề cập từ đầu, dùng widget entry để ghi lại câu trả lời của người chơi. Một bước quan trọng cần nhớ là liên kết phím Enter với một sự kiện trong cửa sổ tkinter để khi người chơi nhấn vào nó, chức năng tương ứng sẽ được triển khai.</p>

<p style="text-align: justify;">Để có kết quả đó, bạn chuyển khóa&nbsp;<strong>&lt;Return&gt;</strong>&nbsp;và hàm&nbsp;<strong>beginGame()</strong>&nbsp;dưới dạng tham số cho hàm&nbsp;<strong>bind()</strong>. Ngoài ra, dùng&nbsp;<strong>pack()</strong>&nbsp;và&nbsp;<strong>focus_set()</strong>&nbsp;để sắp xếp và thiết lập tiêu điểm trên nhãn trường nhập khi bạn nhấn&nbsp;<strong>Enter</strong>.</p>

<pre id="pre8" style="text-align: justify;">
e = Entry(font=20)
root.bind(&#039;&lt;Return&gt;&#039;, beginGame)
e.pack()
e.focus_set()</pre>

<p style="text-align: justify;">Hàm&nbsp;<strong>mainloop()</strong>&nbsp;cho Python biết phải chạy vòng lặp sự kiện tkinter và lắng nghe hành động cho tới khi bạn đóng cửa sổ này.</p>

<pre id="pre9" style="text-align: justify;">
root.mainloop()</pre>

<p style="text-align: justify;">Đặt tất cả code lại với nhau và bạn đã có Color Game thú vị cho mọi người chơi thỏa thích.</p>

<p style="text-align: justify;">Khi chạy chương trình Color Game, một cửa sổ hiện trên màn hình. Khi nhấn Enter, đồng hồ đếm ngược chạy, người chơi phải bắt đầu nhập chính xác tên màu sắc của từ hiện ra. Đối với mỗi câu trả lời đúng, bạn sẽ nhận được một điểm. Khi game kết thúc, tổng điểm số sẽ hiện trên màn hình.</p>

<p style="text-align: justify;"><img alt="Màn hình chơi game" data-i="1" data-src="https://st.quantrimang.com/photos/image/2023/02/22/python-man-hinh-game.jpg" data-was-processed="true" height="416" src="https://st.quantrimang.com/photos/image/2023/02/22/python-man-hinh-game.jpg" width="650" /></p>

<p style="text-align: justify;">Trên đây là cách tạo game bằng Python. Hi vọng bài viết hữu ích với các bạn.</p>
		</div>
				<div id="author">
						<p>
				<strong>Nguồn tin:</strong>
				Quantrimang.com
			</p>
		</div>
	</div>
	<div id="footer" class="clearfix">
		<div id="url">
			<strong>URL của bản tin này: </strong><a href="https://www.nguoicodonvn2008.info/vi/news/savefile/kien-thuc-may-tinh/xay-dung-mot-game-mau-sac-bang-tkinter-trong-python-6770.html" title="Xây dựng một game màu sắc bằng Tkinter trong Python">https://www.nguoicodonvn2008.info/vi/news/savefile/kien-thuc-may-tinh/xay-dung-mot-game-mau-sac-bang-tkinter-trong-python-6770.html</a>

		</div>
		<div class="clear"></div>
		<div class="copyright">
			&copy; .&#x3A; Nguoicodonvn2008.info - Cõi lòng người cô đơn &#x3A;.
		</div>
		<div id="contact">
			<a href="mailto:admin@nguoicodonvn2008.info">admin@nguoicodonvn2008.info</a>
		</div>
	</div>
</div>
        <div id="timeoutsess" class="chromeframe">
            Bạn đã không sử dụng Site, <a onclick="timeoutsesscancel();" href="https://nguoicodonvn2008.info/#">Bấm vào đây để duy trì trạng thái đăng nhập</a>. Thời gian chờ: <span id="secField"> 60 </span> giây
        </div>
        <div id="openidResult" class="nv-alert" style="display:none"></div>
        <div id="openidBt" data-result="" data-redirect=""></div>
		</script>
		<div class="car-top">
  <span><img src="https://nguoicodonvn2008.info/themes/default/images/car.png" alt=""></span>
</div>
<script src="https://nguoicodonvn2008.info/assets/js/jquery/jquery.min.js"></script>
<script>var nv_base_siteurl="/",nv_lang_data="vi",nv_lang_interface="vi",nv_name_variable="nv",nv_fc_variable="op",nv_lang_variable="language",nv_module_name="news",nv_func_name="savefile",nv_is_user=0, nv_my_ofs=-4,nv_my_abbr="EDT",nv_cookie_prefix="nv4c_e856T",nv_check_pass_mstime=1738000,nv_area_admin=0,nv_safemode=0,theme_responsive=0,nv_recaptcha_ver=2,nv_recaptcha_sitekey="",nv_recaptcha_type="image",XSSsanitize=1;</script>
<script src="https://nguoicodonvn2008.info/assets/js/language/vi.js"></script>
<script src="https://nguoicodonvn2008.info/assets/js/DOMPurify/purify3.js"></script>
<script src="https://nguoicodonvn2008.info/assets/js/global.js"></script>
<script src="https://nguoicodonvn2008.info/assets/js/site.js"></script>
<script src="https://nguoicodonvn2008.info/themes/default/js/news.js"></script>
<script src="https://nguoicodonvn2008.info/themes/default/js/main.js"></script>
<script src="https://nguoicodonvn2008.info/themes/default/js/custom.js"></script>
<script type="application/ld+json">
        {
            "@context": "https://schema.org",
            "@type": "Organization",
            "url": "https://nguoicodonvn2008.info",
            "logo": "https://nguoicodonvn2008.info/uploads/angel.gif"
        }
        </script>
<script src="https://nguoicodonvn2008.info/themes/default/js/bootstrap.min.js"></script>
<script type="text/javascript">
var $scrolltop = $('.car-top');
$scrolltop.on('click', function () {
    $('html,body').animate({
        scrollTop: 0
    }, 800);
    $(this).addClass("car-run");
    setTimeout(function(){ $scrolltop.removeClass('car-run');}, 1000);
    return false;
});
$(window).on('scroll', function ()
{ 
    if($(window).scrollTop() >= 200)
    {
        $scrolltop.addClass("show");
        $scrolltop.addClass("car-down");
    }
    else
    {
       $scrolltop.removeClass("show");
       setTimeout(function(){ $scrolltop.removeClass('car-down');}, 300);
    }
});
</script>
</body>
</html>