Background image in pygame did not working [duplicate] - pygame

Hello I would need help I would need to place a background image and some sound. possibly also sound effects after clicking on the button, I have taken over the menu, because I didn't know how to do it, I wanted to do it via the buttons, but somehow it didn't work.
And to advise the game, I have somehow done it in another file, how to get to it using the play button. (I'm a complete beginner in python)
Thanks for answer
import pygame
import pygame_menu
pygame.init()
background = pygame.image.load('qHyYvd.jpeg')
surface = pygame.display.set_mode((600, 400))
pygame.display.set_caption("Trade Ships")
icon = pygame.image.load('2022-03-15_15.28.55.png')
pygame.display.set_icon(icon)
def set_difficulty(value, difficulty):
pass
def start_the_game():
pass
menu = pygame_menu.Menu('Welcome', 400, 300,
theme=pygame_menu.themes.THEME_BLUE)
menu.add.text_input('Name :', default='Save1')
menu.add.selector('Difficulty :', [('Hard', 1), ('Easy', 2)], onchange=set_difficulty)
menu.add.button('Play', start_the_game)
menu.add.button('Quit', pygame_menu.events.EXIT)
menu.mainloop(surface)

Related

Switching background image smoothly - Angular

I am facing problem concerning switching background in Angular 10. I managed to implement switching background image but I would like it to be smooth.
At this moment it looks kind of like the slideshow - one image disappears and the other one appears.
My piece of code looks like this:
In typescript component I hold array of variables with urls to image.
backgroundImages = ['url(/assets/img/background.jpg)', 'url(/assets/img/background2.jpg)']
And in constructor I call refresh method which basically changes the value of variable holding reference to current background
refreshBackground(backgroundNumber: number) {
this.background = this.backgroundImages[backgroundNumber]
if (backgroundNumber == this.backgroundImages.length - 1)
backgroundNumber = 0
else
backgroundNumber++
setTimeout(() => this.refreshBackground(backgroundNumber), 10000)
}
In html this variable is set to style.background
<div class="container background" [style.background]="background">
I would appreciate any help and tips and if more details are needed, ask freely.
Michael

How can I put an image on a Matlab uicontrol button?

I have Matlab 2019b, GUI Layout Toolbox 2.3.4 and t all runs on MacOs 14 Mojave.
I want to create button in in a UI that have icons/images instead of text. I have seen here:
https://undocumentedmatlab.com/blog/html-support-in-matlab-uicomponents/
that it is supposed to be possible to use HTML to render the button contents.
So - I try this sample code:
figure('MenuBar','none','Name','GUI-TEST','NumberTitle','off','Position',[200,200,140,90]);
push_btn = uicontrol('Style','PushButton','String','Push','Position',[30,60,80,20],...
'CallBack','disp(''You are pressed a push button'')');
close_btn = uicontrol('Style','PushButton','String','Close','Position',[30,5,80,50],...
'CallBack','close');
icon_file = fullfile(pwd, 'close.png')
str = ['<html><img src="file://' icon_file '"></html>']
set(close_btn,'String',str);
but it leaves me with an empty button.
If I deliberately use a filename that does not correspond to an existing file, I see a broken image icon:
So I am reasonably sure that the basic syntax and file path stuff is correct but the image does not get rendered in the button.
Is there something else I need to do to make this work or is it all just part of Matlab's overwhelming strangeness?
The easiest way to put an image on a uicontrol (and specifically a button), is to use the CData property,
im_orig = imread(icon_file); % Needs to be true color, i.e. MxNx3
im_sized = imresize(im_orig,[80,50]); % size of the button
% str = ['<html><img src="file://' icon_file '"></html>'];
% set(close_btn,'String',str);
set(close_btn,'CData',im_sized);

create side panels in bokeh for displaying details of hovered data point

I have seen great examples of how bokeh allows you to hover over a data point and display pop up details for it. There are cases the details is so overwhelming voluminous, it really requires a side panel to display it all. Is bokeh a complete enough widget toolkit where I can create a side panel to the main display and show details of a data point following the cursor?
Can someone point out some sample code, or at least the relevant api's.
If you prefer a higher-level API for building and linking Bokeh-based plots, you can use HoloViews; see linking examples at http://holoviews.org/reference/index.html#streams and instructions at http://holoviews.org/user_guide/Custom_Interactivity.html . For example:
import param, numpy as np, holoviews as hv
from holoviews import opts, streams
hv.extension('bokeh')
xvals = np.linspace(0,4,202)
ys,xs = np.meshgrid(xvals, -xvals[::-1])
img = hv.Image(np.sin(((ys)**3)*xs))
pointer = streams.PointerXY(x=0,y=0, source=img)
dmap = hv.DynamicMap(lambda x, y: hv.Points([(x, y)]), streams=[pointer])
dmap = dmap.redim.range(x=(-0.5,0.5), y=(-0.5,0.5))
img + dmap.opts(size=10)
You can find many examples on https://docs.bokeh.org . What you want is possible by adding a callback and updating the relevant part. In this example the div is what you name a side panel in your question.
#for bokeh 1.0.4
from bokeh.plotting import figure
from bokeh.models import ColumnDataSource,Div,Row
from bokeh.io import curdoc
from bokeh.events import Tap
#the data
d={'x':[1,2],'y':[3,4],'info':['some information on a first datapoint','some information on a second datapoint']}
source=ColumnDataSource(d)
tooltips = [("x", "$x"),("y", "$y"),("info","#info")]
fig=figure(tools="tap,reset",tooltips=tooltips)
c=fig.circle('x','y',source=source,size=15)
def callback(event):
indexActive=source.selected.indices[0]
layout.children[1]=Div(text=d['info'][indexActive])#adjust the info on the right
fig.on_event(Tap, callback)
div=Div(text=d['info'][0])
layout=Row(fig,div)
curdoc().add_root(layout)
To run this code, save it as code.py, open a cmd and type "bokeh serve code.py --show".

How do you import an xkcd fig to html using mpld3

I am trying to import a matplotlib to html with xkcd theme. My code is as follows (no data,just a fig)
fig = plt.figure(facecolor = '#eee8d5')
#plt.matplotlib.rcdefaults()
with plt.xkcd():
ax = fig.add_subplot(111)
ax.set_axis_bgcolor('#eee8d5') #set_color('#fdf6e3')
ax.title.set_color('#d33682') # Magenta
ax.tick_params(axis='x', colors='#657b83')
ax.tick_params(axis='y', colors='#657b83')
ax.spines['bottom'].set_color('#657b83')
ax.spines['left'].set_color('#657b83')
ax.spines['right'].set_color('none')
ax.spines['top'].set_color('none')
ax.set_title('Title', fontsize = 18);
html = mpld3.fig_to_html(fig)
Html_file= open("CumPrctWordFrq.html","w")
Html_file.write(html)
Html_file.close()
So far so good -- everything renders correctly in the python notebook. However when I paste the html on a website (squarespace), the fig loses all the xkcd properties. Eventually I would like to make this interactive. The idea is eventually to produce a xkcd -> solarized -> interactive plot.
mpld3 does not yet support the plt.xkcd() mode. If this is something you want, you should creat an issue in the mpld3 issue tracker, and see if someone is inspired to work on it.

AS3 Flip effect leaving a trail?

I'm trying to create something with a flip effect tutorial from tutplus - http://active.tutsplus.com/tutorials/effects/iphone-page-transition-flash/
However my flip area is much bigger than the tutorial, it's 900px wide. Everything works fine except that it leaves a trail when the width is that big. You'll see it when you flip it a few times.
Someone else posted the same problem in the comments from last year, but no one replied.
Does anyone know a solution to this?
Edit:
Here is a screen shot: http://imageshack.us/f/823/unled2lo.jpg/ (click to enlarge)
The front is purple and the back is white.
As you can see it left a bit of the purple as the page flipped to white.
I couldn't get a screen shot of it turning, but it's even more obvious as the page is actually flipping because the width become narrow which reveals a whole lot more that's left behind on the page.
The tutorial you are using create the flip effect using the build in flash tween classes, they are absolute rubbish, and very slow if you compare to other third part tween classes. That may be causing the trail! Lee Brimelow has a great video tutorial about how to do exact what you need: http://gotoandlearn.com/play.php?id=91 he is using caurina, but I highly recommend you to replace it with tweenLight so far the best tween I ever used.
Ok, thats the walkthrough:
1- Download the files from Lee Brimelow tutorial here http://gotoandlearn.com/files/3dflip.zip
2- Download tweenLight AS3 classes here: http://www.greensock.com/tweenlite/
3- copy the com folder inside greensock-as3 and past it inside 3dflip folder. Now you have all the tween classes you need for your flip!
4- open the flash file 3dflip.fla and replace the original code (located in the first frame) with this:
import com.greensock.TweenLite;
import fl.video.*;
con.visible = false;
var flv:FLVPlayback = con.vid.flvp;
flv.addEventListener(VideoEvent.PLAYING_STATE_ENTERED, onStart);
function onStart(e:Event):void
{
con.visible = true;
loading.visible = false;
}
con.vid.spin.addEventListener(MouseEvent.CLICK, cl);
con.tclip.spin.addEventListener(MouseEvent.CLICK, cl);
var isTurning:Boolean = false;
function cl(e:Event):void
{
if(!isTurning)
{
TweenLite.to(con, 1, {rotationY:con.rotationY+180, onComplete:function(){isTurning=false;}});
isTurning = true;
}
}
addEventListener(Event.ENTER_FRAME, loop);
function loop(e:Event):void
{
if(con.rotationY > 90 && con.rotationY < 270)
con.addChild(con.tclip);
else
con.addChild(con.vid);
if(con.rotationY >= 360) con.rotationY = 0;
}
Thats it. Now publish and see the result. Now all you have to do is replace the video player with the content that you want!
I would check the state of first side - it seems that it's forgotten on stage when "the other side" kicks in.