Hoe maak je een Parallax bureaubladachtergrond met Rainmeter

Als je een live geanimeerde bureaubladachtergrond wilt, kijk dan eens naar Rainmeter! Hier laten we u zien hoe u een uniek parallax-effect creëert voor uw bureaubladachtergrond van Windows.

Als je een live geanimeerde bureaubladachtergrond wilt, kijk dan eens naar Rainmeter!  Hier laten we u zien hoe u een uniek parallax-effect creëert voor uw bureaubladachtergrond van Windows.
Advertentie

Rainmeter blijft de kampioen in Windows-aanpassing omdat gebruikers creatieve manieren blijven vinden om het programma te gebruiken.

Een recente innovatie is de parallax-achtergrond. Parallax-effecten zijn een eenvoudige en indrukwekkende manier om het uiterlijk van uw bureaubladachtergrond te verbeteren. Ze bevatten ook live wallpaper-functies Maak uw bureaublad verbluffend met een interactieve live achtergrond Maak uw bureaublad verbluffend met een interactieve live wallpaper Niets laat uw bureaublad opvallen als een live interactieve achtergrond. Het is ook een van de grootste oefeningen bij het aanpassen van je Windows-installatie. We laten u zien hoe u dit eenvoudig kunt doen met Rainmeter. Lees verder .

Laten we u laten zien hoe u uw eigen geanimeerde bureaubladachtergrond kunt maken met behulp van het parallax-effect en de Rainmeter.

Wat is een parallax-effect?

Dictionary.com definieert parallax als:

"[D] e schijnbare verplaatsing van een waargenomen object als gevolg van een verandering in de positie van de waarnemer."

Met behulp van een combinatie van plug-ins en .ini-bestanden - de bestanden die door Rainmeter worden gebruikt om skins of widgets op uw bureaublad te laden - laat Rainmeter uw muis als een camera werken. Terwijl je muis beweegt, verschuiven je afbeeldingen om een ​​3D-effect te creëren.

parallax_explained

Mooie resultaten zijn eenvoudig te bereiken. Dat gezegd hebbende, het kost behoorlijk wat creativiteit om echt spectaculaire resultaten te bereiken. Kijk bijvoorbeeld eens naar dit Firewatch-thema gemaakt door reddit user / u / thefawxyone.

Waarschuwing: als u een gedetailleerd, meerlagig voorbeeld zoals hierboven wilt creëren, heeft u enige ervaring met grafische ontwerpprogramma's zoals Photoshop (onze idiotengids voor Photoshop An Idiot's Guide to Photoshop, deel 1: Easy Photoshop An Idiot's Guide to Photoshop, deel 1: Easy Photoshop Op het eerste gezicht is Photoshop verwarrend, maar je kunt snel op weg zijn om een ​​Photoshop-goeroe te worden.Dit is onze inleidende gids over het uitvoeren van basisfuncties in Photoshop Lees meer) en GIMP (onze GIMP-walkthrough GIMP: een snel overzicht van ieders favoriete Open Source Image Editor GIMP: een snelle doorloop van de favoriete Open Source Image Editor van iedereen Lees meer) is verplicht. We zullen niet ingaan op het creëren van een complexe achtergrond met verborgen programmastarters en VU-meters. Ons parallax-effect zorgt voor een eenvoudige maar indrukwekkende vierlaagse achtergrond.

Delen van de Parallax

Laten we, om dit effect te gebruiken, het concept van lagen kort bespreken. Rainmeter bereikt het parallax-effect door meerdere lagen te maken, die een complete achtergrond simuleren.

Er zijn twee essentiële onderdelen voor het Parallax-effect; de voorgrond en de achtergrond . De voorgrond is samengesteld uit verschillende PNG-afbeeldingsbestanden, van klein tot groot. De grotere afbeeldingen zullen meer bewegen dan de kleinere afbeeldingen. Dit simuleert de scherptediepte op uw bureaublad. Afbeeldingsbestanden moeten in transparante PNG-indeling JPEG, GIF of PNG zijn? Beeldtypes Explained and Tested JPEG, GIF of PNG? Image Filetypes Explained and Tested Kent u de verschillen tussen JPEG's, GIF's, PNG's en andere afbeeldingsbestandtypen? Weet je wanneer je de ene in plaats van de andere zou moeten gebruiken? Vrees niet, MakeUseOf legt alles uit! Lees meer, dat witte achtergronden uit uw afbeeldingen verwijdert.

De onderdelen kiezen

Ik zal een vallende Bart van The Simpsons simuleren met behulp van het parallax-effect. Er zijn drie afbeeldingstypen vereist voor het effect: een vallende Bart, sommige wolken in het bijzonder voor de stripstijl van The Simpsons en een hemelachtergrond.

Maak een map op uw bureaublad genaamd parallax-bron om uw afbeeldingsbestanden op te slaan. Dit maakt het gemakkelijker om uw afbeeldingen toe te voegen aan Rainmeter. Door middel van Google search Een goed gebruik van de zoekoperators van Google maken Een goed gebruik maken van de zoekoperators van Google Met operatoren kunt u resultaten weergeven die alleen betrekking hebben op bepaalde websites, een reeks nummers doorzoeken of zelfs helemaal uitsluiten woord uit uw resultaten. Wanneer je het gebruik van Google's beheerst ... Lees ik vond een .png"-afbeelding van vallende Bart. Het is mogelijk dat u zelf een transparante .png"-afbeelding moet maken Achtergrondafbeelding in seconden met de gratis achtergrondbrander verwijderen Achtergrondafbeelding in seconden met de gratis achtergrondbrander verwijderen Hoe moeilijk is het om de achtergrond volledig van een foto te verwijderen? Voor de grafisch uitgedaagde onder ons is het antwoord "pretty darn hard". Deze gratis online tool maakt het een stuk eenvoudiger. Lees verder .

bart_falling

Vervolgens heb ik cloud- en achtergrondafbeeldingen nodig. Vergeet niet dat elk element aanwezig moet zijn in zijn eigen .png"-bestand. Ik vond dit beeld van wolken in de stijl van de klassieke Simpson online:

wolken

Ik ging verder met het scheiden van enkele wolken met Photoshop en creëerde afzonderlijke afbeeldingsbestanden voor de drie prominente clouds. Voor de achtergrond heb ik kleurstalen van de onderste en bovenste blauwtinten in de originele afbeelding genomen en mijn eigen verloop gemaakt Snel 3-kleuren CSS3 Gradiëntgenerator: eenvoudig lineaire en radiale verlopen maken Snelle 3-kleuren CSS3 Gradiëntgenerator: eenvoudig lineair maken & Radiale verlopen Lees meer. In totaal worden vijf beeldbestanden gebruikt, inclusief de achtergrond.

Geef je achtergrond background.png" een naam en noem de afbeeldingen die je gebruikt voor je parallax als parallax [x] .png" . De [x] komt overeen met het laagniveau, beginnend bij 0. De kleinste afbeelding zou de titel parallax0.png" moeten hebben, de op een na kleinste, parallax1.png", enzovoort. Dit is hoe uw map eruit zou moeten zien:

files_in_folders

De onderdelen positioneren

Plaats nu je .png"-bestanden op basis van je desktopresolutie. Controleer uw bureaubladresolutie door met de rechtermuisknop op uw bureaublad te klikken en Beeldinstellingen te selecteren. Klik op Geavanceerde weergave-instellingen en selecteer de Aanbevolen instellingen onder Resolutie . Deze twee cijfers komen overeen met de pixelbreedte en -hoogte van uw beeldscherm. Resolutie van grafisch display - Wat betekenen de cijfers? [MakeUseOf Explains] Grafische weergaveresoluties - Wat betekenen de getallen? [MakeUseOf Explains] Beeldschermresoluties kunnen een nogal cryptisch bedrijf zijn, waarbij meerdere standaarden worden gebruikt om dezelfde schermresolutie op 10 verschillende manieren te beschrijven. Al deze technische termen hebben de neiging te veranderen op basis van het doel van het display ... Lees meer.

Maak een transparant document ter grootte van uw monitorresolutie met een extra 100 pixels aan uw lengte en breedte. Zet je bestanden neer in dit frame en richt de afbeeldingen naar wens.

resolution_and_transparency

De manier waarop u uw afbeeldingen hier oriënteert, is zoals u ze op uw achtergrond ziet. Zodra u al uw afbeeldingen in uw frame hebt geplaatst, gaat u verder met het maken van uw INI-bestanden.

Rainmeter Folder Layout

Maak in de directory C: \ Users \ Rosebud \ Documents \ Rainmeter \ Skins een nieuwe map met de naam Parallax Effect .

Maak in deze map nog drie mappen en noem ze: @Resources, Background en Parallax . De map @Resources bevat al uw afbeeldingen, de map Background bevat uw Background.ini-bestand om uw achtergrond te activeren en de map Parallax zal uw Parallax.ini-bestand bevatten om uw parallaxafbeeldingen te activeren.

folder_layout

Open de map @Resources en maak een map met de naam Afbeeldingen . Voeg uw achtergrond.png"-bestand toe aan deze map. Voeg een andere map toe aan deze map en noem deze na uw parallax-effect. Ik heb mijn Bart genoemd . Voeg uw parallax [x] .png"-afbeeldingen toe aan deze map. Je afbeeldingenmap zou er nu zo uit moeten zien.

images_folder

Dat is het voor beeldbestanden. Nu kunt u beginnen met het bereiken van het parallax-effect. Maak een nieuw tekstbestand in de hoofdmap Parallax Effect-map ( C: \ Users \ Rosebud \ Documents \ Rainmeter \ Skins \ Parallax Effect ). Voer de volgende code in dit nieuwe document in.

 [Variabelen] ThemeDisplayWidth = 1440 ThemeDisplayHeight = 900 

Noem dit bestand ParallaxSettings.inc, let op de extensie .inc. Dit bestand definieert de resolutie van je parallax. Vervang 1440 en 900 met uw eigen resolutie en sla op. U hebt ook een eenvoudige plug-in nodig, die uw muisbewegingen bijhoudt om uw parallaxafbeeldingen te verplaatsen. Download de .rmskin hier om hem automatisch in Rainmeter te installeren.

rainmeter_mousexy

Open vervolgens uw achtergrondmap. Klik met de rechtermuisknop in de map en selecteer Nieuw> Tekstdocument . Dubbelklik op dit document om het volgende script in het bestand te bewerken en te plakken.

 [Rainmeter] Update = -1 SkinHeight = # ThemeDisplayHeight # SkinWidth = # ThemeDisplayWidth # [Variables] @ Include = # ROOTCONFIGPATH # ParallaxSettings.inc P = # @ # Images / [Background] Meter = afbeelding SolidColor = 33, 0, 2, 255 W = # SCREENAREAWIDTH # H = # SCREENAREAHEIGHT # [Parallax0] Meter = Image ImageName = # P # background.png" X = ((# SCREENAREAWIDTH # / 2) - ([Parallax0: W] / 2)) Y = 0 DynamicVariables = 1 

Sla dit bestand op als Background.ini en zorg ervoor dat u de extensie .ini hebt toegevoegd. Open vervolgens je Parallax-map. Maak een tekstdocument en plak het volgende in dit bestand.

 [Rainmeter] Update = 20 SkinHeight = # ThemeDisplayHeight # SkinWidth = # ThemeDisplayWidth # [Variables] @ Include = # ROOTCONFIGPATH # ParallaxSettings.inc P = # @ # Images / Bart / parallax [MouseX] Measure = Plugin Plugin = MouseXY Dimension = X [MouseY] Measure = Plugin Plugin = MouseXY Dimension = Y [Parallax1] Meter = Image ImageName = # P # 0.png" X = (((# SCREENAREAWIDTH # / 2) - ([Parallax1: W] / 2)) - ( ([MouseX] - (# SCREENAREAWIDTH # / 2)) / 80)) Y = (0 - (([MouseY] - # SCREENAREAHEIGHT # / 2) / 80)) DynamicVariables = 1 [Parallax2] Meter = Image ImageName = # P # 1.png" X = (((SCREENAREABIDD # / 2) - ([Parallax2: W] / 2)) - (([MouseX] - (# SCREENAREAWIDTH # / 2)) / 60)) Y = (0 - (([MouseY] - # SCREENAREAHEIGHT # / 2) / 60)) DynamicVariables = 1 [Parallax3] Meter = Image ImageName = # P # 2.png" X = (((# SCREENAREAWIDTH # / 2) - ([Parallax3: W] / 2)) - (([MouseX] - (# SCREENAREAWIDTH # / 2)) / 30)) Y = (0 - (([MouseY] - # SCREENAREAHEIGHT # / 2) / 30)) DynamicVariables = 1 [ Parallax4] Meter = Image ImageName = # P # 3.png" X = (((# SCREENAREAWIDTH # / 2) - ([Parallax4: W] / 2)) - (([MouseX] - (# SCREENAREAWIDT H # / 2)) / 20)) Y = 5 DynamicVariables = 1 

U moet de P- variabele onder uw [Variables] -parameter wijzigen in de titel van uw parallaxafbeeldingenmap. Mijn variabele P is # # # Images / Bart / parallax, bijvoorbeeld. Verander alleen de middelste titel en houd de rest hetzelfde.

bart_parallax

Het resultaat

Open het venster Rainmeter beheren door de taakbalk van uw taakbalk te openen en op het pictogram Rainmeter te klikken. Klik op de knop Alles vernieuwen en zoek de map Parallax Effect. Open uw nieuw gemaakte achtergrond- en parallax-mappen en laad uw .ini-bestanden door erop te dubbelklikken. Controleer tot slot Click through in het Rainmeter-venster beheren voor beide INI-bestanden en uw parallax-effect moet compleet zijn.

Het bovenstaande script zorgt voor een subtiel effect. Als u het effect dramatischer wilt maken, verlaagt u de nummerparameters in het bestand Parallax.ini met 10 of 20 (geen getallen herhalen of nummers onder 0 opnemen).

parallax_percentage

Vergeet niet om uw .ini-bestand op te slaan en uw skin te verversen om het effect uit te voeren.

Niet vasthouden aan statische elektriciteit

Vasthouden aan statische, niet-bewegende achtergronden is prima voor sommigen. Voor anderen is Rainmeter een zegen. Het programma lijkt onbegrensd. Slanke regenmeter skins De beste regenmeter skins voor een minimalistische desktop De beste Rainmeter skins voor een minimalistische desktop Rainmeter is een krachtig hulpmiddel voor het aanpassen van Windows met skins en suites. We hebben de beste Rainmeter voor een indrukwekkende en minimalistische Windows-desktop samengesteld. Read More wordt dagelijks gemaakt om aan te sluiten op de gewenste desktopstijl. Het Parallax-effect Rainmeter is slechts een van de meest recente innovaties in Rainmeter-skins, en het gebruik ervan is alleen beperkt tot uw verbeelding.

Een speciale dank aan Reddit-gebruiker / u / thefawxyone, wiens creatieve werk de backbones leverde voor de gebruikte maplay-out en .ini-bestanden. Als je mijn Bart-parallax-achtergrond wilt installeren, download je hier de .rmskin.

Welke andere effecten zou u graag zien of gebruiken met Rainmeter? Laat het ons weten in de comments hieronder!

In this article