如何调整图像尺寸同时保持边框厚度？（Python Arcade GUI开发）

你需要的是**9切片缩放（9-slice scaling）**技术，这是GUI开发中处理带边框图片拉伸的标准方案，能完美保持边框厚度不变，同时让中间区域自适应尺寸。下面是具体实现步骤和Python代码示例：

核心思路 #

把图片切割成9个区域：

• 4个角区域：完全不拉伸，保持原始尺寸，用于保留边框的圆角或直角细节
• 4个边区域：仅沿垂直或水平方向拉伸（比如上边只横向拉伸，左边只纵向拉伸），维持边框厚度
• 1个中间区域：可同时沿水平和垂直方向拉伸，填充组件内部空间

用PIL实现9切片拼接 #

假设你的边框图片上下左右边框厚度都是border_size像素，目标尺寸是target_width和target_height，代码示例如下：

from PIL import Image

def scale_9slice(image_path, border_size, target_width, target_height):
    # 加载原始图片
    img = Image.open(image_path).convert("RGBA")
    original_w, original_h = img.size

    # 裁剪9个区域
    # 四个角
    top_left = img.crop((0, 0, border_size, border_size))
    top_right = img.crop((original_w - border_size, 0, original_w, border_size))
    bottom_left = img.crop((0, original_h - border_size, border_size, original_h))
    bottom_right = img.crop((original_w - border_size, original_h - border_size, original_w, original_h))

    # 四条边
    top_edge = img.crop((border_size, 0, original_w - border_size, border_size))
    bottom_edge = img.crop((border_size, original_h - border_size, original_w - border_size, original_h))
    left_edge = img.crop((0, border_size, border_size, original_h - border_size))
    right_edge = img.crop((original_w - border_size, border_size, original_w, original_h - border_size))

    # 中间区域
    center = img.crop((border_size, border_size, original_w - border_size, original_h - border_size))

    # 创建目标画布
    target_img = Image.new("RGBA", (target_width, target_height))

    # 粘贴四个角
    target_img.paste(top_left, (0, 0))
    target_img.paste(top_right, (target_width - border_size, 0))
    target_img.paste(bottom_left, (0, target_height - border_size))
    target_img.paste(bottom_right, (target_width - border_size, target_height - border_size))

    # 拉伸并粘贴四条边
    target_img.paste(top_edge.resize((target_width - 2*border_size, border_size)), (border_size, 0))
    target_img.paste(bottom_edge.resize((target_width - 2*border_size, border_size)), (border_size, target_height - border_size))
    target_img.paste(left_edge.resize((border_size, target_height - 2*border_size)), (0, border_size))
    target_img.paste(right_edge.resize((border_size, target_height - 2*border_size)), (target_width - border_size, border_size))

    # 拉伸并粘贴中间区域
    target_img.paste(center.resize((target_width - 2*border_size, target_height - 2*border_size)), (border_size, border_size))

    return target_img

结合Arcade使用 #

把生成的PIL图片转换成Arcade可用的纹理：

import arcade
from PIL import Image
import io

# 生成缩放后的图片
scaled_img = scale_9slice("border_button.png", 4, 200, 80)

# 转换成Arcade纹理
img_bytes = io.BytesIO()
scaled_img.save(img_bytes, format="PNG")
img_bytes.seek(0)
texture = arcade.load_texture(img_bytes)

# 渲染到屏幕
arcade.draw_texture_rectangle(x=400, y=300, width=200, height=80, texture=texture)

注意事项 #

• 确保border_size值准确对应你图片的实际边框厚度，否则会导致拼接错位
• 如果图片有圆角，四个角的裁剪尺寸要刚好覆盖圆角部分，避免拉伸时圆角变形
• 支持透明通道的图片（RGBA模式），保证组件背景透明时渲染正常

内容的提问来源于stack exchange，提问作者Ethan Chan