Giter Site home page Giter Site logo

canyonturtle / bevy_pixel_camera Goto Github PK

View Code? Open in Web Editor NEW

This project forked from drakmaniso/bevy_pixel_camera

0.0 0.0 0.0 95 KB

A simple pixel-perfect camera plugin for Bevy, suitable for pixel-art.

License: Apache License 2.0

Rust 100.00%

bevy_pixel_camera's Introduction

bevy_pixel_camera

A simple camera plugin for the Bevy game engine, to help with the use of pixel-art sprites.

This crates provides a plugin to automatically configure Bevy's Camera2dBundle. It works by setting the camera to a scaling factor (using Bevy's ScalingMode::WindowSize), and automatically updating the zoom level so that the specified target resolution fills as much of the sceen as possible.

Two scaling types are supported: Forcing integer scaling (guranteeing perfectly square pixels), or allowing float scaling(which can fill the whole screen).

The plugin can also automatically set and resize the viewport of the camera to match the target resolution.

Comparison with other methods

There is two main methods to render pixel-art games: upscale each sprite independently, or render everything to an offscreen texture and only upscale this texture. This crate use the first method. There is advantages and drawbacks to both approaches.

Advantages of the "upscale each sprite independently" method (i.e. this crate):

  • allows for smoother scrolling and movement of sprites, if you're willing to temporarily break the alignment on virtual pixels (this would be even more effective with a dedicated upscaling shader);
  • easier to mix pixel-art and high resolution graphics (for example for text, particles or effects).

Advantages of the "offscreen texture" method:

  • always ensure perfect alignment on virtual pixels (authentic "retro" look);
  • may be more efficient (in most cases, the difference is probably negligible on modern computers).

How to use

Note that Bevy uses linear sampling by default for textures, which is not what you want for pixel art. The easiest way to change this is to configure Bevy's default plugins with ImagePlugin::default_nearest().

Also note that if either the width or the height of your sprite is not divisible by 2, you may need to change the anchor of the sprite (which is at the center by default), otherwise it won't be aligned with virtual pixels.

use bevy::prelude::*;
use bevy::sprite::Anchor;
use bevy_pixel_camera::{
    FitType, PixelCamScalingMode, PixelCameraPlugin, PixelViewport, PixelZoom
};

fn main() {
    App::new()
        .add_plugins(DefaultPlugins.set(ImagePlugin::default_nearest()))
        .add_plugins(PixelCameraPlugin)
        .add_systems(Startup, setup)
        .run();
}

fn setup(
    mut commands: Commands,
    asset_server: Res<AssetServer>,
) {
    commands.spawn((
        Camera2dBundle::default(),
        PixelZoom{
            fit_type: FitType::FitSize {
                width: 320,
                height: 180,
            },
            pixel_cam_scaling_mode: PixelCamScalingMode::AllowFloat,
        },
        PixelViewport,
    ));

    commands.spawn(SpriteBundle {
        texture: asset_server.load("my-pixel-art-sprite.png"),
        sprite: Sprite {
            anchor: Anchor::BottomLeft,
            ..Default::default()
        },
        ..Default::default()
    });
}

A small example is included in the crate. Run it with:

cargo run --example flappin

Bevy versions supported

bevy bevy_pixel_camera
0.12 0.12
0.11 0.5.2
0.10 0.4.1
0.9 0.3
0.8 0.2

Migration guide: 0.4 to 0.5 (Bevy 0.10 to 0.11)

The PixelBorderPlugin has been deprecated. If you want a border around your virtual resolution, pass true to the set_viewport argument when creating the camera bundle (see example above).

Migration guide: 0.5 to 0.12 (Bevy 0.11 to 0.12)

The PixelCameraBundle has been deprecated. Replace it with a standard Camera2dBundle, to which you add the PixelZoom and PixelViewport components.

License

Licensed under either of

at your option.

License: MIT OR Apache-2.0

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.