用Python來改改大西瓜｜Python 主題月

「本文已參與好文召集令活動，點擊查看：後端、大前端雙賽道投稿，2萬元獎池等你挑戰！」html

本文正在參加「Python主題月」，詳情查看活動連接前端

噹噹噹當~ （文末有試玩地址）vue

吃瓜嘞~ 吃瓜嘞~node

先給小夥伴們看看這個效果~python

簡單介紹下水果的種類~git

哈哈哈哈我看那個橘子也太像籃球了吧菠蘿有點像榴蓮披薩~github

對應代碼裏的水果以下~ 這裏黃色方框的數字就是水果數組fruits中的最後一個web

下面這注釋掉的部分是遊戲的主要邏輯~chrome

當你點擊使水果掉落後 createFruitCount 會加一，vue-cli

開始順序是葡萄葡萄葡萄櫻桃橘子橘子檸檬而後就開始隨機上面水果數組fruits 中的前五種水果啦~

這裏博主把這段邏輯註釋掉，換成這句代碼就變成上面 gif 圖的效果啦

a.default.Instance.createOneFruit(9)

修改圖片的話也比較簡單，咱們只須要經過chrome瀏覽器的調試窗口就i能夠看到這些圖片，接着替換他們便可

博主這裏也將他們整理出來啦~

水果	地址	尺寸
葡萄	http://192.168.142.1:5000/res/raw-assets/ad/ad16ccdc-975e-4393-ae7b-8ac79c3795f2.png	52*52
櫻桃	http://192.168.142.1:5000/res/raw-assets/0c/0cbb3dbb-2a85-42a5-be21-9839611e5af7.png	80*80
橘子	http://192.168.142.1:5000/res/raw-assets/d0/d0c676e4-0956-4a03-90af-fee028cfabe4.png	108*108
檸檬	http://192.168.142.1:5000/res/raw-assets/74/74237057-2880-4e1f-8a78-6d8ef00a1f5f.png	119*119
獼猴桃	http://192.168.142.1:5000/res/raw-assets/13/132ded82-3e39-4e2e-bc34-fc934870f84c.png	153*152
番茄	http://192.168.142.1:5000/res/raw-assets/03/03c33f55-5932-4ff7-896b-814ba3a8edb8.png	183*183
桃子	http://192.168.142.1:5000/res/raw-assets/66/665a0ec9-6c43-4858-974c-025514f2a0e7.png	193*193
菠蘿	http://192.168.142.1:5000/res/raw-assets/84/84bc9d40-83d0-480c-b46a-3ef59e603e14.png	258*258
椰子	http://192.168.142.1:5000/res/raw-assets/5f/5fa0264d-acbf-4a7b-8923-c106ec3b9215.png	308*308
半個西瓜	http://192.168.142.1:5000/res/raw-assets/56/564ba620-6a55-4cbe-a5a6-6fa3edd80151.png	308*309
大西瓜	http://192.168.142.1:5000/res/raw-assets/50/5035266c-8df3-4236-8d82-a375e97a0d9c.png	408*408

下面進入python教學~

先準備好圖片，命名以下像這樣子~

接下來要使用用 python 的 PIL 庫將他們裁剪成圓形

安裝模塊

pip install pillow
複製代碼

代碼參考了 www.sohu.com/a/336796776… 這篇文章

建立 ``image2circle.py` 文件

# -*- coding: utf-8 -*-
# @Time : 2021/2/10 17:01
# @Author : Java4ye

from PIL import Image, ImageDraw, ImageFilter
import os


def crop_max_square(pil_img):
    return crop_center(pil_img, min(pil_img.size), min(pil_img.size))


def crop_center(pil_img, crop_width, crop_height):
    img_width, img_height = pil_img.size
    return pil_img.crop(
        (
            (img_width - crop_width) // 2,
            (img_height - crop_height) // 2,
            (img_width + crop_width) // 2,
            (img_height + crop_height) // 2)
    )


def mask_circle_transparent(pil_img, blur_radius, offset=0):
    offset = blur_radius * 2 + offset
    mask = Image.new("L", pil_img.size, 0)
    draw = ImageDraw.Draw(mask)
    draw.ellipse((offset, offset, pil_img.size[0] - offset, pil_img.size[1] - offset), fill=255)
    mask = mask.filter(ImageFilter.GaussianBlur(blur_radius))
    result = pil_img.copy()
    result.putalpha(mask)
    return result


imgFolder = "H://dxg_img"

imgs = os.listdir(imgFolder)
for img in imgs:
    print(img)
    img_path = os.path.join(imgFolder, img)
    if os.path.isfile(img_path):
        markImg = Image.open(img_path)
        w, h = markImg.size

        # thumb_width = 158
        im_square = crop_max_square(markImg).resize((w, h), Image.LANCZOS)
        im_thumb = mask_circle_transparent(im_square, 0)
        im_thumb.save('H://dxg_img//circle//' + img)
複製代碼

建立 `resetImage2dxg.py` 文件

這裏主要是幫你將圖片拷貝到對應的文件夾~

import os
import shutil
import time

millis = int(round(time.time() * 1000))

daxiegua_dir = "I://daxigua-1.0.0//"
imgFolder = "H://dxg_img//circle"

urls = [
    'http://192.168.142.1:5000/res/raw-assets/ad/ad16ccdc-975e-4393-ae7b-8ac79c3795f2.png',
    'http://192.168.142.1:5000/res/raw-assets/0c/0cbb3dbb-2a85-42a5-be21-9839611e5af7.png',
    'http://192.168.142.1:5000/res/raw-assets/d0/d0c676e4-0956-4a03-90af-fee028cfabe4.png',
    'http://192.168.142.1:5000/res/raw-assets/74/74237057-2880-4e1f-8a78-6d8ef00a1f5f.png',
    'http://192.168.142.1:5000/res/raw-assets/13/132ded82-3e39-4e2e-bc34-fc934870f84c.png',
    'http://192.168.142.1:5000/res/raw-assets/03/03c33f55-5932-4ff7-896b-814ba3a8edb8.png',
    'http://192.168.142.1:5000/res/raw-assets/66/665a0ec9-6c43-4858-974c-025514f2a0e7.png',
    'http://192.168.142.1:5000/res/raw-assets/84/84bc9d40-83d0-480c-b46a-3ef59e603e14.png',
    'http://192.168.142.1:5000/res/raw-assets/5f/5fa0264d-acbf-4a7b-8923-c106ec3b9215.png',
    'http://192.168.142.1:5000/res/raw-assets/56/564ba620-6a55-4cbe-a5a6-6fa3edd80151.png',
    'http://192.168.142.1:5000/res/raw-assets/50/5035266c-8df3-4236-8d82-a375e97a0d9c.png'
]
imgs = [
    '52.png',
    '80.png',
    '108.png',
    '119.png',
    '153.png',
    '183.png',
    '193.png',
    '258.png',
    '308.png',
    '309.png',
    '408.png'
]



i = 0
for url in urls:
    a = url.rindex(":")
    beginIndex = url.index("/", a)
    lastIndex = url.rindex("/")
    contextPath = url[beginIndex:lastIndex + 1]
    realFileName = url[lastIndex + 1:]
    folder = daxiegua_dir + contextPath
    fileNames = os.listdir(folder)
    for fileName in fileNames:
        if fileName == realFileName:
            arr = fileName.split(".")
            os.path.join(folder, )
            shutil.copyfile(folder + "//" + fileName, folder + "//" + "Java4ye_" + str(millis) + "." + arr[1])
            shutil.copyfile(imgFolder + "//" + imgs[i], folder + "//" + fileName)
            i += 1
複製代碼

準備好土圖片後，運行 ``image2circle.py文件將圖片剪切成圓形的，接着運行resetImage2dxg.py` 文件便可將圖片拷貝到相應的目錄中。

博主這裏參考了魚皮大佬的教程： juejin.cn/post/692304…

下面是源碼地址： github.com/liyupi/daxi…

在本地運行的話須要安裝 node.js 還有 vue-cli 還有 serve 。具體能夠看看上面大佬的文章

運行起來的效果以下：

打開項目結構咱們能夠看到下面這些文件~

紅框這個是什麼呢？

搜搜看，原來是遊戲引擎！！！

哇塞！完了感受又要入坑啥了我這該死的好奇心（我 Springcloud Gateway 還沒寫呢 (。・∀・)ノ）

www.cocos.com/docs

看了老半天發現還對電腦顯卡有點要求，想了想我滴小霸王仍是算了哈哈哈

教程地址： docs.cocos.com/creator/man…

不過仍是有點小收穫的~ 這東西還能夠變得Q彈！

在文檔中點擊輸入查找 PhysicsCircleCollider

添加上述代碼可實現下面的效果

試玩地址

dxgv01.vercel.app

最後

歡迎小夥伴們來一塊兒探討問題~

若是你以爲本篇文章還不錯的話，那拜託再點點贊支持一下呀😝

讓咱們開始這一場意外的相遇吧！~

歡迎留言！謝謝支持！ヾ(≧▽≦*)o 沖沖衝！！

我是4ye 我們下期應該……很快再見！！ 😆