We Keep Coding

Button color does not change dynamically (Xamarin.Forms)

I am trying to write a game for myself using Xamarin. The problem is that I can't make the colors dynamically change after the start button is pressed. At first I tried to do it through the BackgroundColor property, but because it didn't work, I decided to use dynamic resources, but that doesn't work either. Please help me find a mistake in the code or algorithm.
P.s
The idea of ​​the game is this: to reproduce a sequence of colors from memory, the difficulty gradually increases: at first only one button is highlighted, then there are already two buttons, and so on. Victory is achieved if you accurately reach the 20th stage (reproduce a sequence of 20 colors) and complete it.
P.p.s
I ran the app on my phone - Xiaomi Poco X3 NFC, my OS is MIUI 12 (Android 10).
MainPage.xaml.cs
using System;
using System.Threading;
using Xamarin.Forms;
namespace JustRepeat
{
public partial class MainPage : ContentPage
{
public readonly MethodsCollection methodsCollection;
public readonly Button[] buttonsMas;
public MainPage()
{
InitializeComponent();
methodsCollection = new MethodsCollection(this);
buttonsMas = new Button[] { one, two, three, four, five, six, seven, eight, nine };
}
private void Button_Clicked(object sender, EventArgs e)
{
methodsCollection.PlaySequence();
startstop.IsEnabled = false;
}
private void Buttons_Clicked(object sender, EventArgs e)
{
bool result = methodsCollection.CheckSequence((Button)sender, out int currStg);
if (!result)
{
DisplayAlert("Notification", $"You lose.\nThe last passed stage: {currStg}.", "OK");
startstop.IsEnabled = true;
return;
}
else if (result & currStg == 20)
{
DisplayAlert("Notification", "You won!", "OK");
startstop.IsEnabled = true;
}
}
}
public class MethodsCollection
{
private readonly MainPage mainPage;
private Color[] colors;
private int[] sequence;
private int currentStage = 1;
private int currentMember = 0;
public MethodsCollection(MainPage mP)
{
mainPage = mP;
}
private int[] GenerateSequence(int currentNumber)
{
Random random = new Random();
int[] posMas = new int[currentNumber];
for (int i = 0; i < posMas.Length; i++)
{
posMas[i] = random.Next(1, 10);
}
return posMas;
}
public void PlaySequence()
{
Random random = new Random();
sequence = GenerateSequence(currentStage);
colors = new Color[currentStage];
for (int i = 0; i < sequence.Length; i++)
{
colors[i] = Color.FromRgb(random.Next(0, 256), random.Next(0, 256), random.Next(0, 256));
mainPage.Resources[string.Format("{0}", sequence[i])] = colors[i];
Thread.Sleep(1000);
mainPage.Resources[string.Format("{0}", sequence[i])] = Color.LightGray;
}
}
public bool CheckSequence(Button btn, out int stage)
{
int pos = 0;
for (int i = 0; i < mainPage.buttonsMas.Length; i++)
{
if (btn == mainPage.buttonsMas[i])
{
pos = i;
}
}
if (currentStage == 20)
{
if (pos == sequence[currentMember])
{
SetColor();
ClearVariables();
stage = currentStage;
currentStage = 1;
return true;
}
ClearVariables();
stage = currentStage - 1;
currentStage = 1;
return false;
}
if (currentStage - currentMember == 1)
{
if (pos == sequence[currentMember])
{
SetColor();
ClearVariables();
stage = currentStage++;
return true;
}
ClearVariables();
stage = currentStage - 1;
currentStage = 1;
return false;
}
if (pos == sequence[currentMember])
{
currentMember++;
stage = currentStage;
return true;
}
else
{
ClearVariables();
stage = currentStage - 1;
currentStage = 1;
return false;
}
}
private void SetColor()
{
mainPage.Resources[string.Format("{0}", sequence[currentMember])] = colors[currentMember];
Thread.Sleep(1000);
mainPage.Resources[string.Format("{0}", sequence[currentMember])] = Color.LightGray;
}
private void ClearVariables()
{
currentMember = 0;
sequence = null;
colors = null;
}
}
}
MainPage.xaml
<?xml version="1.0" encoding="utf-8" ?>
<ContentPage xmlns="http://xamarin.com/schemas/2014/forms"
xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
x:Class="JustRepeat.MainPage">
<ContentPage.Resources>
<ResourceDictionary>
<Color x:Key="1">LightGray</Color>
<Color x:Key="2">LightGray</Color>
<Color x:Key="3">LightGray</Color>
<Color x:Key="4">LightGray</Color>
<Color x:Key="5">LightGray</Color>
<Color x:Key="6">LightGray</Color>
<Color x:Key="7">LightGray</Color>
<Color x:Key="8">LightGray</Color>
<Color x:Key="9">LightGray</Color>
</ResourceDictionary>
</ContentPage.Resources>
<StackLayout>
<Grid VerticalOptions="FillAndExpand" >
<Button BackgroundColor="{DynamicResource Key=1}" Clicked="Buttons_Clicked" Grid.Column="0" Grid.Row="0" x:Name="one"/>
<Button BackgroundColor="{DynamicResource Key=2}" Clicked="Buttons_Clicked" Grid.Column="1" Grid.Row="0" x:Name="two"/>
<Button BackgroundColor="{DynamicResource Key=3}" Clicked="Buttons_Clicked" Grid.Column="2" Grid.Row="0" x:Name="three"/>
<Button BackgroundColor="{DynamicResource Key=4}" Clicked="Buttons_Clicked" Grid.Column="0" Grid.Row="1" x:Name="four"/>
<Button BackgroundColor="{DynamicResource Key=5}" Clicked="Buttons_Clicked" Grid.Column="1" Grid.Row="1" x:Name="five"/>
<Button BackgroundColor="{DynamicResource Key=6}" Clicked="Buttons_Clicked" Grid.Column="2" Grid.Row="1" x:Name="six"/>
<Button BackgroundColor="{DynamicResource Key=7}" Clicked="Buttons_Clicked" Grid.Column="0" Grid.Row="2" x:Name="seven"/>
<Button BackgroundColor="{DynamicResource Key=8}" Clicked="Buttons_Clicked" Grid.Column="1" Grid.Row="2" x:Name="eight"/>
<Button BackgroundColor="{DynamicResource Key=9}" Clicked="Buttons_Clicked" Grid.Column="2" Grid.Row="2" x:Name="nine"/>
</Grid>
<Button BackgroundColor="DarkGray" Text="Старт" Clicked="Button_Clicked" VerticalOptions="Fill" x:Name="startstop"/>
</StackLayout>
</ContentPage>

Trying to do "anything" like setting the color of a button to displaying an error in xamarin needs to be done in the correct place in the correct way. In your code setting the color of the buttons is irrelevant to your Application because you do not invoke the changes.
Setting the color with:
Device.BeginInvokeOnMainThread(() =>
{
// Your method to change the color.
button.BackgroundColor = Color.Black; // Or whatever.
});
If you need a DisplayAlert for example you can do this async too.
Device.BeginInvokeOnMainThread(async () => // <-----
{
// You await the message
await DisplayAlert("Attention", "Color changed!", "OK);
});
Resolved this to the comments, but i posted an answer for future reference.

Changing the value of a resource AFTER the page has been loaded won't affect the button color - it has already been read from the resource.
Instead, give the button an x:Name, so you can set its background color directly.
xaml:
<Button x:Name="button1" ... />
cs:
button1.BackgroundColor = ...;
OR might Device.BeginInvokeOnMainThread, as shown in stersym's answer.
(I added a new answer because that answer did not show x:Name.)
IMPORTANT: Intellisense won't know about button1 until after you build. What I do is add x:Name to XAML, build project, then add cs code that uses the name.

how can i add a lot of children without freeze the app xamarin forms

in the view page - xaml code
<ScrollView>
<StackLayout Orientation="Vertical" x:Name="SL">
</StackLayout>
</ScrollView>
code behind
public Page3()
{
InitializeComponent();
InitAsync();
}
private async void InitAsync()
{
await Task.Run(() =>
{
Thread.Sleep(3000);
});
btn5.Text = "Task 1 Done";
await Task.Run(() =>
{
Thread.Sleep(1000);
});
btn6.Text = "Task 2 Done";
Button[] btn1 = new Button[2000];
for(int i=0; i< btn1.Length; i++)
{
btn1[i] = new Button();
btn1[i].HorizontalOptions = LayoutOptions.Fill;
btn1[i].HeightRequest = 50;
btn1[i].Text = i.ToString();
SL.Children.Add(btn1[i]);
}
}
now the problem is that the app freez until the for loop add all buttons,
how can i let the app not freez when this loop working? thank you.

Try this , it will not freeze your UI
Xaml
<StackLayout>
<Button Text="Add Data" Clicked="Button_Clicked"/>
<ListView x:Name="myListView">
<ListView.ItemTemplate>
<DataTemplate>
<ViewCell>
<Button Text="{Binding .}"/>
</ViewCell>
</DataTemplate>
</ListView.ItemTemplate>
</ListView>
</StackLayout>
Code Behind
private ObservableCollection<string> longList = new ObservableCollection<string>();
public ObservableCollection<string> LongList { get => longList; set { longList = value; OnPropertyChanged(nameof(LongList)); } }
...
private void Button_Clicked(object sender, System.EventArgs e)
{
Task.Run(() =>
{
for (int i = 0; i < 2000; i++)
{
LongList.Add(i.ToString());
}
Device.BeginInvokeOnMainThread(() =>
{
myListView.ItemsSource = LongList;
});
});
}

How to create variable number of RichTextBoxOverflow elements

I'm trying in every way to get out of the loop that must create multiple RichTextBlockOverflow controls based on arbitrary input text length but without success. The HasOverflowContent property doesn't update either synchronously or asynchronously.
The variable bool "ThereIsText" I can not understand when and how to make it false to stop the loop.
The link with the text to paste in the paragraph "Run" is: text to paste.
MainPage.xaml:
<Page
x:Class="Text_Viewer_Test_UWP.MainPage"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:local="using:Text_Viewer_Test_UWP"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
mc:Ignorable="d">
<Grid Background="{ThemeResource ApplicationPageBackgroundThemeBrush}">
<Grid x:Name="Menù" HorizontalAlignment="Left" Width="290" Padding="0" Margin="0,21,0,0">
<Grid Background="White">
<Grid.RowDefinitions>
<RowDefinition Height="50"/>
<RowDefinition Height="50"/>
<RowDefinition Height="50"/>
</Grid.RowDefinitions>
<Button Grid.Row="0" x:Name="btnLoadText" Click="btnLoadText_Click" Content="Display text" HorizontalAlignment="Center" VerticalAlignment="Center" Width="270" Foreground="White" Height="32"/>
<TextBlock Grid.Row="1" x:Name="txtPage" HorizontalAlignment="Center" VerticalAlignment="Center"/>
</Grid>
</Grid>
<Grid x:Name="BaseGrid" Margin="320,10,30,10" HorizontalAlignment="Stretch" VerticalAlignment="Stretch" Background="Black">
<ScrollViewer x:Name="PageViewer" Background="White" VerticalScrollBarVisibility="Disabled" HorizontalScrollBarVisibility="Visible" VerticalScrollMode="Disabled" HorizontalScrollMode="Enabled">
<StackPanel x:Name="StackViewer" VirtualizingStackPanel.VirtualizationMode="Recycling" Orientation="Horizontal"/>
</ScrollViewer>
</Grid>
</Grid>
MainPage.xaml.cs:
public sealed partial class MainPage : Page
{
RichTextBlock TextOneRich = new RichTextBlock() { Margin = new Thickness(20) };
List<RichTextBlockOverflow> TextList = new List<RichTextBlockOverflow>();
bool ThereIsText = true;
public MainPage()
{
this.InitializeComponent();
StackViewer.Children.Add(TextOneRich);
TextOneRich.Width = 400;
TextOneRich.TextAlignment = TextAlignment.Justify;
}
private async void btnLoadText_Click(object sender, RoutedEventArgs e)
{
TextList.Clear();
TextOneRich.Blocks.Clear();
StackViewer.Children.Clear();
StackViewer.Children.Add(TextOneRich);
Paragraph paragraphText = new Paragraph();
paragraphText.Inlines.Clear();
paragraphText.Inlines.Add(new Run { Text = "PasteTextHere" });
await Task.Run(async () =>
{
await Dispatcher.RunAsync(Windows.UI.Core.CoreDispatcherPriority.Normal, () =>
{
TextOneRich.Blocks.Add(paragraphText);
});
}).ContinueWith(async t =>
{
await Dispatcher.RunAsync(Windows.UI.Core.CoreDispatcherPriority.Normal, () =>
{
TextList.Add(new RichTextBlockOverflow() { Width = 400, Margin = new Thickness(20) });
StackViewer.Children.Add(TextList[0]);
TextOneRich.OverflowContentTarget = TextList[0];
});
});
await Task.Run(async () =>
{
await Dispatcher.RunAsync(Windows.UI.Core.CoreDispatcherPriority.Normal, async () =>
{
while (ThereIsText)
{
await Task.Run(async () =>
{
await Dispatcher.RunAsync(Windows.UI.Core.CoreDispatcherPriority.Normal, () =>
{
TextList.Add(new RichTextBlockOverflow() { Width = 400, Margin = new Thickness(20) });
StackViewer.Children.Add(TextList[TextList.Count - 1]);
TextList[TextList.Count - 2].OverflowContentTarget = TextList[TextList.Count - 1];
txtPage.Text = TextList.Count.ToString();
});
});
}
});
});
}
}

If you need to do a lot of manipulation of UI objects, and you want to keep the UI responsive while you do that(1) then you can generally just await for a single millisecond, which will allow the UI to process any input messages etc.
Trying to access the HasOverflowContent property is problematic since it requires a layout pass to complete, and that could take an arbitrary amount of time. We could just await an arbitrary amount of time - say 50ms - but that wouldn't be ideal. Instead, you can use a technique similar to the one from "Waiting for XAML layout to complete" with a slight adjustment.
This XAML and code adds 1000 lines of text to a set of RichTextBlock / RichTextBlockOverflow controls and does so while keeping the UI responsive (the ball keeps moving, and you can scroll the list at any time):
XAML:
<Grid Background="{ThemeResource ApplicationPageBackgroundThemeBrush}">
<StackPanel Margin="20" HorizontalAlignment="Stretch" x:Name="container">
<Ellipse Width="20" Height="20" Margin="0, 5" Fill="red"
x:Name="animation" HorizontalAlignment="Left"/>
<Button Content="Go" Click="Go" Margin="0,0,0,5"/>
<ScrollViewer MaxHeight="500">
<StackPanel x:Name="thePanel"/>
</ScrollViewer>
</StackPanel>
</Grid>
Code:
public static class Extensions
{
// This helper function is essentially the same as this answer:
// https://stackoverflow.com/a/14132711/4184842
//
// It adds an additional forced 1ms delay to let the UI thread
// catch up.
public static Task FinishLayoutAsync(this FrameworkElement element)
{
TaskCompletionSource<bool> tcs = new TaskCompletionSource<bool>();
// Setup handler that will be raised when layout has completed.
EventHandler<object> handler = null;
handler = (s, a) =>
{
element.LayoutUpdated -= handler;
tcs.SetResult(true);
};
element.LayoutUpdated += handler;
// Await at least 1 ms (to force UI pump) and until the Task is completed
// If you don't wait the 1ms then you can get a 'layout cycle detected' error
// from the XAML runtime.
return Task.WhenAll(new[] { Task.Delay(1), tcs.Task });
}
}
public sealed partial class MainPage : Page
{
public MainPage()
{
InitializeComponent();
// Simple animation to show the UI is not frozen
BadUiAnimation_DontDoThis();
}
// Very VERY bad way of doing animation, but it shows
// that the UI is still responsive. Normally you should
// use StoryBoards to do animation.
void BadUiAnimation_DontDoThis()
{
DispatcherTimer dt = new DispatcherTimer();
dt.Interval = TimeSpan.FromMilliseconds(33);
int delta = 4;
const int width = 20;
dt.Tick += (s, a) =>
{
var leftOffset = animation.Margin.Left;
if (leftOffset + delta < 0)
{
delta *= -1;
leftOffset = 0;
}
else if (leftOffset + delta + width > container.ActualWidth)
{
delta *= -1;
leftOffset = container.ActualWidth - width;
}
else
{
leftOffset += delta;
}
animation.Margin = new Thickness(leftOffset, 5, 0, 5);
};
dt.Start();
}
private async void Go(object sender, RoutedEventArgs e)
{
// Helper function
void AppendSimpleString(string s)
{
RichTextBlock rtb = new RichTextBlock();
rtb.Blocks.Add(CreateParagraphWithText(s));
thePanel.Children.Add(rtb);
}
// Another helper function
Paragraph CreateParagraphWithText(string s)
{
var p = new Paragraph();
var r = new Run();
r.Text = s;
p.Inlines.Add(r);
return p;
}
// Disable the button so you can't click it again until the
// insertion is over
(sender as Button).IsEnabled = false;
thePanel.Children.Clear();
AppendSimpleString($"Begin...{Environment.NewLine}");
// Generate some dummy strings to add to the page
var strings = new StringBuilder();
for (int i = 0; i < 1000; i++)
strings.Append($"This is line {i + 1}{Environment.NewLine}");
string text = strings.ToString();
// Create initial block with far too much text in it
var source = new RichTextBlock();
source.MaxHeight = 100;
source.Blocks.Add(CreateParagraphWithText(text));
thePanel.Children.Add(source);
// Create the first overflow and connect it to the original textblock
var prev = new RichTextBlockOverflow
{
MaxHeight = 100,
Margin = new Thickness(0, 10, 0, 0)
};
thePanel.Children.Add(prev);
source.OverflowContentTarget = prev;
// Wait for layout to complete so we can check the
// HasOverflowContent property
await prev.FinishLayoutAsync();
// Keep creating more overflows until there is no content left
while (prev.HasOverflowContent)
{
var next = new RichTextBlockOverflow
{
MaxHeight = 100,
Margin = new Thickness(0, 10, 0, 0)
};
thePanel.Children.Add(next);
prev.OverflowContentTarget = next;
// Wait for layout to complete, which will compute whether there
// is additional overflow (or not)
await prev.FinishLayoutAsync();
prev = next;
};
AppendSimpleString($"Done!{Environment.NewLine}");
// Enable interaction with the button again
(sender as Button).IsEnabled = true;
}
}
(1): Note that you probably want to do something to limit interaction with your UI while this is happening, which might require you to disable some controls or otherwise make sure the user doesn't mess with your app's state. The sample does this by disabling and then re-enabling the button.

Progress Bar not updating using BackgroundWorker

I'm trying to read a file and display the progress on the screen.
It should be displayed on a Progress Bar (progress) and a textbox (progress_text).
This is the code I'm using:
public partial class MainWindow : Window
{
public static List<String> file = new List<String>();
public long currentPosition = 0;
String line;
long length;
public BackgroundWorker worker = new BackgroundWorker();
public MainWindow()
{
InitializeComponent();
worker.WorkerReportsProgress = true;
worker.DoWork += worker_DoWork;
worker.ProgressChanged += worker_ProgressChanged;
}
private void Start(object sender, RoutedEventArgs e)
{
worker.RunWorkerAsync();
}
void worker_DoWork(object sender, DoWorkEventArgs e)
{
BackgroundWorker bg = sender as BackgroundWorker;
Dispatcher.Invoke(() =>
{
progress.Minimum = 0;
progress.Maximum = 100;
FileInfo fi = new FileInfo(upload.Text);
length = fi.Length;
int percent;
using (StreamReader sr = new StreamReader(upload.Text, System.Text.Encoding.ASCII))
{
while (sr.EndOfStream == false)
{
line = sr.ReadLine();
file.Add(line);
currentPosition += line.Count();
percent = (int)(100.0 / length * currentPosition);
bg.ReportProgress(percent);
}
}
});
}
void worker_ProgressChanged(object sender, ProgressChangedEventArgs e)
{
progress.Value = e.ProgressPercentage;
progress_text.Text = "reading " + currentPosition + " out of " + length;
}
}
XAML:
<Window x:Class="ProgressBarUploadFile.MainWindow"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
Title="MainWindow" Height="350" Width="525"
>
<Grid>
<Grid.RowDefinitions>
<RowDefinition Height="20*"/>
<RowDefinition Height="20*"/>
</Grid.RowDefinitions>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="20*"/>
<ColumnDefinition Width="20*"/>
</Grid.ColumnDefinitions>
<Button Grid.Row="0" Grid.Column="0" Content="Select File" FontSize="15" Click="Upload_file"/>
<TextBox x:Name="upload" Grid.Row="0" Grid.Column="1" Text="" />
<Button Grid.Row="1" Grid.Column="0" Content="Start upload" FontSize="15" Click="Start"/>
<ProgressBar Name="progress" Grid.Row="1" Grid.Column="1" />
<TextBlock Name="progress_text" Grid.Row="1" Grid.Column="1" VerticalAlignment="Bottom"/>
</Grid>
When I run it in debug, it seems to be working.
But the progress bar and textbox are updated only when the file is read completely.
I followed a few tutorials, such as:
https://msdn.microsoft.com/en-us/library/cc221403%28v=vs.95%29.aspx?f=255&MSPPError=-2147217396
http://www.wpf-tutorial.com/misc-controls/the-progressbar-control/
But I can't figure it out..
I think it's something very small, but I can't find it.
Thank you!

Try this code:
private void Start(object sender, RoutedEventArgs e)
{
progress.Minimum = 0;
progress.Maximum = 100;
worker.RunWorkerAsync();
}
BackgroundWorker bg = sender as BackgroundWorker;
FileInfo fi = new FileInfo(#"File");
length = fi.Length;
int percent;
using (StreamReader sr = new StreamReader(#"File", System.Text.Encoding.ASCII))
{
while (sr.EndOfStream == false)
{
line = sr.ReadLine();
file.Add(line);
currentPosition += line.Count();
percent = (int)(currentPosition / length) * 100;
bg.ReportProgress(percent);
Thread.Sleep(100);
}
}

Your code has this problem:
(int)(a / b) * 100 will calculate a/b first then convert it to int and then *100, so before a reaches b, the a/b will always be 0.* and (int)(a/b) will always be 0 so the final value 0*100 will always be 0.
Suddenly when a=b then (int)(a/b) become 1 and the final value changed to 100. That is why your progress bar will not be updated until the file is read completely
So, you should use percent = (int)(currentPosition * 100 / length);
Or as #jmc suggested in the comment: use percent = (int)(100.0 / length * currentPosition);

backgroundworker+wpf -> frozen window

-progressbar always 0%
-the window is froozen (while DoWork r.)
-if System.threading.thread.sleep(1) on - works perfectly
whats the problem?
private void btnNext_Click(object sender, RoutedEventArgs e)
{
this._worker = new BackgroundWorker();
this._worker.DoWork += delegate(object s, DoWorkEventArgs args)
{
long current = 1;
long max = generalMaxSzam();
for (int i = 1; i <= 30; i++)
{
for (int j = i+1; j <= 30; j++)
{
for (int c = j+1; c <= 30; c++)
{
for (int h = c+1; h <= 30; h++)
{
for (int d = h+1; d <= 30; d++)
{
int percent = Convert.ToInt32(((decimal)current / (decimal)max) * 100);
this._worker.ReportProgress(percent);
current++;
//System.Threading.Thread.Sleep(1); - it works well
}
}
}
}
}
};
this._worker.WorkerReportsProgress = true;
this._worker.RunWorkerCompleted += delegate(object s, RunWorkerCompletedEventArgs args)
{
this.Close();
};
this._worker.ProgressChanged += delegate(object s, ProgressChangedEventArgs args)
{
this.statusPG.Value = args.ProgressPercentage;
};
this._worker.RunWorkerAsync();
}
<Window x:Class="SzerencsejatekProgram.Create"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
Title="Létrehozás" mc:Ignorable="d" xmlns:d="http://schemas.microsoft.com/expression/blend/2008" xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" Height="500" Width="700">
<DockPanel>
<Button DockPanel.Dock="Right" Name="btnNext" Width="80" Click="btnNext_Click">Tovább</Button>
<StatusBar DockPanel.Dock="Bottom">
<StatusBar.ItemsPanel>
<ItemsPanelTemplate>
<Grid>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="*"/>
<ColumnDefinition Width="Auto"/>
<ColumnDefinition Width="auto"/>
<ColumnDefinition Width="auto"/>
</Grid.ColumnDefinitions>
</Grid>
</ItemsPanelTemplate>
</StatusBar.ItemsPanel>
<StatusBarItem Grid.Column="1">
<TextBlock Name="statusText"></TextBlock>
</StatusBarItem>
<StatusBarItem Grid.Column="2">
<ProgressBar Name="statusPG" Width="80" Height="18" IsEnabled="False" />
</StatusBarItem>
<StatusBarItem Grid.Column="3">
<Button Name="statusB" IsCancel="True" IsEnabled="False">Cancel</Button>
</StatusBarItem>
</StatusBar>
</DockPanel>
</Window>

Your code runs a very tight loop and at its center it calls ReportProgress().
This means that your MessageQueue is swamped with requests to execute the Progress updates.
If you build some delay (Thread.Sleep(100)) into the Bgw thread you will see the responsiveness improve.
A more practical solution is to move the reporting out to the outer loop. In your case:
for (int i = 1; i <= 30; i++)
{
int percent = (i * 100) / 30;
_worker.ReportProgress(percent);
for(int j = 0; ....)
....
}
If you only have 1 loop, build in a delay: 'if ((counter % 100) == 0) ...`
Your target here is the user, aim for between 10 and 100 calls to Reportprogress.

Your anonymous method for the ProgressChanged event will run on UI thread. since you're reporting frequent progress it will be queued up in by the dispatcher and blocks the UI.

if (current++ % onePercent == 0)
{
int percent = Convert.ToInt32(((decimal)current / (decimal)max) * 100);
this._worker.ReportProgress(percent, new WorkerUserState { current = current, max = max });
}
this works well.