如何快速检查我的精灵瓷砖是否铺好？

47

我正在尝试创建很好地平铺的tilemap精灵，但是检查它们平铺的程度确实很麻烦。

理想情况下，我想使用一个图像编辑器来显示这样的布局，因此无需手动检查，我就能看到它是否平铺：

     [img]
[img][img][img]
     [img]

哪些程序可以做到这一点，或者我怎样才能使它更容易？

— 734
source

我认为您正在谈论检查纹理平铺是否无缝工作。至少据我所知，gimp具有render-> map或执行此操作的某种功能。但在编辑时不行。否则，沃利（Wally）具有此功能，但是该死的太老了。（半生命纹理编辑器）

— v.oddou

1

amnoid.de/ddsview支持多种图像格式的平铺预览。您正在使用哪个图像编辑器？我确定它有某种平铺图像的方法。

— snake5 2015年

1

您正在使用哪个编辑器？应该可以使用Photoshops智能对象将某些东西一起

— 砍掉

4

将其设置为桌面背景，然后选择“平铺”选项。

— user14146

“什么程序可以做到这一点” Krita可以做到这一点，它甚至可以让您在包裹时喘气（请参阅下面的答案）

— darkflame 2015年

67

这是适用于任何图像编辑器的快速技巧。

如果您的平铺图片称为tile.png，则创建index.html如下所示的图片：

<body style="background:url(tile.png) repeat 0 0"></body>

^{（感谢@Deryllium为更简单的选择！）}

在网络浏览器中打开它。

每当需要检查图像平铺效果时，保存并刷新Web浏览器。

GIMP的导出快捷方式是，Ctrle而Chromium的刷新快捷方式是Ctrlr。该e和r是一个QWERTY相邻，所以这是非常快的事情。

— 安科
source

10

很有创造力！您还可以使用<body style="background: url(tile.jpg) repeat 0 0;">

— driima

15

您还可以在<body>之前添加<header> <meta http-equiv =“ Refresh” content =“ 2”> </ header>，以使页面每2秒自动加载一次。

— Shivan Dragon

7

或者，如果您愿意，可以更深入地设置诸如grunt或gulp之类的工具来监视更改并在进行更改时实时重新加载浏览器。

— Seiyria

1

据报道，@ Kroltan ddsview具有专门的“平铺视图”。GIMP的洪水填充工具可以从剪贴板中读取，也可以使用它进行快速测试。

— Anko

2

@Anko True，但我的意思是提供一个实际的，可编辑的且功能齐全的平铺视图。这些工具可以使其更快，但不是无缝的过程（意外的双关语）。

— Kroltan

18

使用photoshop或GIMP，可以使用offset命令。如果您要制作一张100x100像素的图像，则可以在每个方向上将其偏移50像素，并且图像平铺在一起的接缝将显示在图像的中间。

此页面的屏幕截图展示了其工作原理：http：//blogs.adobe.com/jkost/2015/01/how-to-create-a-seamless-pattern-tile-in-photoshop.html

— Fabspro
source

2

另外，缝线正好位于图像的中间，可以快速轻松地进行编辑！

— Cort Ammon

17

Krita具有一项功能，可让您编辑拼贴纹理并实时查看更改。通过按W键，可以启用环绕模式，这使这成为可能。有关此功能的youtube视频可在此处获得。（功能在0:12启用）

— KritaUser00402050
source

2

这值得更多的投票。它是一款完全可以按一下按钮即可完成所需功能的软件。更好的是，它还可以让您的绘画也环绕起来-几乎可以肯定，这将帮助任何制作无缝纹理的人。您还应该指出，Krita是免费的，可以下载；krita.org/download/krita-desktop

— darkflame

1

+1如果有人有相同的问题，这是他们应该看到的第一个答案。“哪些程序可以做到这一点？” “克里塔”。

— Jibb Smart 2015年

6

使您的瓷砖在桌面上成为瓷砖墙纸。超级简单，无需编码或其他软件。

— 果酱卷
source

2

+1这工作壮观很好的Linux上inotifywait -m -e modify --format '%w' tile.png | while read file; do feh --bg-tile "$file"; done运行。只需保存图像即可；墙纸立即更改。除之外，还可以与指定的多个文件一起使用tile.png。当我不需要全屏显示时，这很糟糕。

— 安科

5

如果您要测试多张图像，则可以根据Anko的答案安装一个微型Web应用程序。这将使您将图像拖到页面上，以便快速连续地测试它们：

window.addEventListener('load', function() {
  document.body.addEventListener('dragover', function(event) {
    // Accept the drag
    event.preventDefault();
  });

  document.body.addEventListener('drop', function(event) {
    // Prevent page redirect
    event.stopPropagation();
    event.preventDefault();

    var reader = new FileReader();

    reader.onload = function(e) {
      // Set background image
      document.body.style.background = 'url(' + e.target.result + ') repeat 0 0';
      document.body.textContent = ''; // Remove instructions
    };

    // Begin reading file
    reader.readAsDataURL(event.dataTransfer.files[0]);
  });
});

html, body {
  width: 100%;
  height: 100%;
  box-sizing: border-box;
}

html {
  border: 2px dashed black;
}

body {
  padding: 10px;
}

<p>Drag an image here</p>

展开摘要

— 阿比阿比斯
source

1

另一个非常直观的答案。您可以使用此扩展程序创建chrome扩展程序或创建Node.js / Electron桌面应用程序。

— driima 2015年

0

在GIMP中：过滤器->地图->平铺。如果将单位更改为“％”，然后输入300％x 300％作为尺寸，则将获得3x3的图像平铺，使您可以轻松查看所有四个边缘。完成此操作后，只要不使用其他任何过滤器，就可以在修改后使用Ctrl-F（重复最后一个过滤器）重新进行平铺。

— 霍布斯
source