用 SDL2 平铺背景并显示前景

环境:SDL2 + VC++2015

下面的代码将打开background.bmp和image.bmp,将background平铺背景,将image作为前景呈现

  1 #include <iostream>
  2 #include "SDL.h"
  3
  4 //屏幕宽度
  5 const int SCREEN_WIDTH = 640;
  6 const int SCREEN_HEIGHT = 480;
  7
  8 //全局窗口和渲染器
  9 SDL_Window *window = nullptr;
 10 SDL_Renderer *renderer = nullptr;
 11
 12 //加载图片
 13 SDL_Texture* LoadImage(std::string file)
 14 {
 15     SDL_Surface *loadedImage = nullptr;
 16     SDL_Texture *texture = nullptr;
 17
 18     loadedImage = SDL_LoadBMP(file.c_str());
 19     if (loadedImage != nullptr)
 20     {
 21         texture = SDL_CreateTextureFromSurface(renderer, loadedImage);
 22         SDL_FreeSurface(loadedImage);
 23     }
 24     else
 25         std::cout << SDL_GetError() << std::endl;
 26     return texture;
 27 }
 28
 29 //将表面应用到渲染器
 30 void ApplySurface(int x, int y, SDL_Texture *tex, SDL_Renderer *rend)
 31 {
 32     SDL_Rect pos;
 33     pos.x = x;
 34     pos.y = y;
 35     SDL_QueryTexture(tex, NULL, NULL, &pos.w, &pos.h);
 36     SDL_RenderCopy(rend, tex, NULL, &pos);
 37 }
 38
 39 int main(int argc, char** argv)
 40 {
 41     //初始化SDL
 42     if (SDL_Init(SDL_INIT_EVERYTHING) == -1)
 43     {
 44         std::cout << SDL_GetError() << std::endl;
 45         return 1;
 46     }
 47
 48     //创建窗口
 49     window = SDL_CreateWindow("Lesson 2",
 50         SDL_WINDOWPOS_CENTERED, SDL_WINDOWPOS_CENTERED,
 51         SCREEN_WIDTH, SCREEN_HEIGHT, SDL_WINDOW_SHOWN);
 52     if (window == nullptr)
 53     {
 54         std::cout << SDL_GetError() << std::endl;
 55         return 2;
 56     }
 57
 58     //创建渲染器
 59     renderer = SDL_CreateRenderer(window, -1,
 60         SDL_RENDERER_ACCELERATED | SDL_RENDERER_PRESENTVSYNC);
 61     if (renderer == nullptr)
 62     {
 63         std::cout << SDL_GetError() << std::endl;
 64         return 3;
 65     }
 66
 67     //创建背景和前景纹理
 68     SDL_Texture *background = nullptr, *image = nullptr;
 69     background = LoadImage("background.bmp");
 70     image = LoadImage("image.bmp");
 71     if (background == nullptr || image == nullptr)
 72         return 4;
 73
 74     //清空渲染器
 75     SDL_RenderClear(renderer);
 76
 77     //在渲染器内平铺背景
 78     int bW, bH;
 79     SDL_QueryTexture(background, NULL, NULL, &bW, &bH);
 80     ApplySurface(0, 0, background, renderer);
 81     ApplySurface(bW, 0, background, renderer);
 82     ApplySurface(0, bH, background, renderer);
 83     ApplySurface(bW, bH, background, renderer);
 84
 85     //在渲染器中央放置前景
 86     int iW, iH;
 87     SDL_QueryTexture(image, NULL, NULL, &iW, &iH);
 88     int x = SCREEN_WIDTH / 2 - iW / 2;
 89     int y = SCREEN_HEIGHT / 2 - iH / 2;
 90     ApplySurface(x, y, image, renderer);
 91
 92     //呈现渲染器
 93     SDL_RenderPresent(renderer);
 94     SDL_Delay(2000);
 95
 96     //释放资源
 97     SDL_DestroyTexture(background);
 98     SDL_DestroyTexture(image);
 99     SDL_DestroyRenderer(renderer);
100     SDL_DestroyWindow(window);
101
102     SDL_Quit();
103
104     return 0;
105 }

彩蛋:

如果窗口变成了1920*1080呢?上面的平铺方法就不够灵活了。试下:

1     int bW, bH;
2     SDL_QueryTexture(background, NULL, NULL, &bW, &bH);
3     for (int y = 0; y <= SCREEN_HEIGHT; y += bH)
4         for (int x = 0; x <= SCREEN_WIDTH; x += bW)
5             ApplySurface(x, y, background, renderer);
时间: 2024-10-07 02:12:17

用 SDL2 平铺背景并显示前景的相关文章

用 SDL2 加载PNG平铺背景并显示前景

上一篇中加载的是BMP,这次可以引用 SDL2_image.lib,加载更多格式的图像. LoadImage函数做了改动,区别在于不用将surface转换成texture了. 环境:SDL2 + VC++2015 下面的代码将打开background.png和image.png,将background平铺背景,将image作为前景呈现. 1 #include <stdexcept> 2 #include <string> 3 #include <iostream> 4

CSS平铺背景图片实现百分比图表

<html xmlns="http://www.w3.org/1999/xhtml"><head><meta http-equiv="Content-Type" content="text/html; charset=gb2312" /><title>使用背景图片百分比创建图表</title><style type="text/css" media="

CSS背景100%平铺 浏览器缩小背景显示不全解决办法

本文我们分享前端CSS背景100%平铺,浏览器缩小背景显示不全bug解决的两个方法,如果你也遇到了,那么就可以参考下面文章. 把浏览器的窗口缩小时,拖动滚动条时你会发现原本设定的CSS背景100%平铺的背景少了一块,而且窗口越小时,空白越大. 解决方法: width:100%;min-width:990px; 在width:100%; 后面加个 min-width:**px; 这个长度取于你的网页最低宽度. Ps: 逐风个人认为上诉的解决方案还不够人性化, 想要实现不同分辨率下灵活覆盖,逐风推荐

Android 背景图片平铺

在drawable目录下创建一个repeat_bg.xml: <?xml version="1.0" encoding="utf-8"?> <bitmap xmlns:android="http://schemas.android.com/apk/res/android"     android:src="@drawable/asdfg"     android:tileMode="repeat&q

Duilib技巧:背景图片平铺

贴图的描述 方式有两种    // 1.aaa.jpg    // 2.file='aaa.jpg' res='' restype='0' dest='0,0,0,0' source='0,0,0,0' corner='0,0,0,0'     // mask='#FF0000' fade='255' hole='false' xtiled='false' ytiled='false' 第一种是最简单的,加载图片文件并将整张图片拉伸铺满整个控件 第二种既支持从文件中加载图片,也可以从资源中加载1

网页导航菜单的子菜单平铺(带背景栏)实现

- 之前给公司做的一个小型知识库管理网站时遇到一个问题,在这里记录下解决的过程. 公司的美工要求首页导航菜单 要跟他们公司的网站风格保持一致,如图所示 (子菜单是平铺的) 我一看,心想很简单嘛 先贴一下通用菜单html结构 <li>     <a href="" class="abc">热设计</a>          <ul>               <li><a href="&quo

2018.12.7边界圆角redius,背景图设置,平铺,精灵图,盒子伪类索引

一选择器复习 <!DOCTYPE html><html><head> <meta charset="UTF-8"> <title>复习预习</title></head><body> 复习预习 <!-- 1.组合选择器 --> <!-- 群组选择器: div, #div, .div { 该样式块同时控制多个(div, #div, .div) } 每一个选择器位均可以为基础选择

如何通过CSS实现背景图片自动平铺或拉伸至整个屏幕(自适应大小)

默认情况下,通过HTML代码的BODY标签设置好背景图片<body background="x.jpg"> 后,图片会自动横向和纵向平铺.这就会产生一些美观上的问题. XP人提供CSS代码如下,放在页面头部即可,仅供参考: <style type="text/css"> body { background:url(/img/background.png); background-repeat: repeat-x; background-pos

Android: 背景图片平铺要这么干

<?xml version="1.0" encoding="utf-8"?>  <bitmap xmlns:android="http://schemas.android.com/apk/res/android"    android:src="@drawable/bg_header"      android:tileMode="repeat" >  </bitmap>