Skip to main content

Tkinter layout doesn’t place buttons in the right place

I am trying to make an image viewer using Python Tkinter as a part of the course I am participating in and I am having some trouble with my code.

My problem is in the positioning of the forward and the exit button in the first image, The picture explains this Look at the exit and forward(>>) button under the screen By the way, this problem is only appears in the first image but in the others, the positioning is perfect as shown in the picture the back(<<) and the forward and the exit buttons are in the correct position

I have tried to read and debug the code multiple times, and I have even looked at the source code from the course, but I still can't seem to find the issue. Do you have any suggestions or recognize any bugs that I may have missed? Any help would be greatly appreciated. Thank you!

Here is all code:

#importing files
from tkinter import *

from PIL import ImageTk,Image

#the start of the program

root = Tk()

root.title("Image Viewer")

root.iconbitmap("E:\Marwan\PROGRAMMING\learning 
py\Tkinter\Projects\#2 Image Viewer\image viewer.ico")

#Image used
my_img1 = ImageTk.PhotoImage(Image.open("E:/Marwan\IMAGES/ai 
images/3.png"))
my_img2 = 
ImageTk.PhotoImage(Image.open("E:\Marwan\IMAGES\megory2.PNG"))
my_img3 = 

ImageTk.PhotoImage(Image.open("E:\Marwan\IMAGES\marwan.JPG"))
my_img4 = ImageTk.PhotoImage(Image.open("E:/Marwan\IMAGES/ai 
images/ff.png"))
my_img5 = ImageTk.PhotoImage(Image.open("E:/Marwan/IMAGES/ai 
images/55.png"))
my_img6 = ImageTk.PhotoImage(Image.open("E:/Marwan/IMAGES/ai 
images/77.png"))

#list of the images
image_list = [my_img1,my_img2,my_img3,my_img4, my_img5,my_img6]
#previwing the images at the first time
my_label = Label(image=my_img1)
my_label.grid(row=0, column=0)

#function of the forward button
def forward(img_num):
    #globaling the vars
    global my_label
global button_forward
global button_back
#forgetting the last img
my_label.grid_forget()
#previewing the current img
my_label = Label(image=image_list[img_num-1])
#commanding the buttons
button_forward = Button(root, text='>>', command= lambda: 
forward(img_num+1))
button_back = Button(root, text='<<', command= lambda: 
back(img_num-1))
#disabling the forward button at the last img
if img_num == 5:
    button_forward = Button(root, text='>>', state=DISABLED) 
#gridding the widgets and appears it   
my_label.grid(row=0,column=0,columnspan=3)
button_forward.grid(row=1, column=2)
button_back.grid(row=1, column=0)


#function of the forward button
def back(img_num):
    global my_label
    global button_forward
    global button_back
    
    my_label.grid_forget()
    my_label = Label(image=image_list[img_num-1])
    button_forward = Button(root, text='>>', command= lambda: 
    forward(img_num+1))
    button_back = Button(root, text='<<', command= lambda: 
    back(img_num-1))

if img_num == 5:
    button_forward = Button(root, text='>>', state=DISABLED) 
    
my_label.grid(row=0,column=0,columnspan=3)
button_forward.grid(row=1, column=2)
button_back.grid(row=1, column=0)




#Buttons of the first img
button_back = Button(root, text='<<',command= back, 
state=DISABLED)

button_exit = Button(root, text='Exit Program', 
command=root.quit)

button_forward = Button(root, text='>>', command= lambda: 
forward(2))

#gridding the widgets and appears it
button_back.grid(row=1, column=0)
button_exit.grid(row=1, column=1)

button_forward.grid(row=1, column=2)
root.mainloop()


source https://stackoverflow.com/questions/77509825/tkinter-layout-doesn-t-place-buttons-in-the-right-place

Comments

Popular posts from this blog

Prop `className` did not match in next js app

I have written a sample code ( Github Link here ). this is a simple next js app, but giving me error when I refresh the page. This seems to be the common problem and I tried the fix provided in the internet but does not seem to fix my issue. The error is Warning: Prop className did not match. Server: "MuiBox-root MuiBox-root-1" Client: "MuiBox-root MuiBox-root-2". Did changes for _document.js, modified _app.js as mentioned in official website and solutions in stackoverflow. but nothing seems to work. Could someone take a look and help me whats wrong with the code? Via Active questions tagged javascript - Stack Overflow https://ift.tt/2FdjaAW

How to show number of registered users in Laravel based on usertype?

i'm trying to display data from the database in the admin dashboard i used this: <?php use Illuminate\Support\Facades\DB; $users = DB::table('users')->count(); echo $users; ?> and i have successfully get the correct data from the database but what if i want to display a specific data for example in this user table there is "usertype" that specify if the user is normal user or admin i want to user the same code above but to display a specific usertype i tried this: <?php use Illuminate\Support\Facades\DB; $users = DB::table('users')->count()->WHERE usertype =admin; echo $users; ?> but it didn't work, what am i doing wrong? source https://stackoverflow.com/questions/68199726/how-to-show-number-of-registered-users-in-laravel-based-on-usertype

Why is my reports service not connecting?

I am trying to pull some data from a Postgres database using Node.js and node-postures but I can't figure out why my service isn't connecting. my routes/index.js file: const express = require('express'); const router = express.Router(); const ordersCountController = require('../controllers/ordersCountController'); const ordersController = require('../controllers/ordersController'); const weeklyReportsController = require('../controllers/weeklyReportsController'); router.get('/orders_count', ordersCountController); router.get('/orders', ordersController); router.get('/weekly_reports', weeklyReportsController); module.exports = router; My controllers/weeklyReportsController.js file: const weeklyReportsService = require('../services/weeklyReportsService'); const weeklyReportsController = async (req, res) => { try { const data = await weeklyReportsService; res.json({data}) console