Some UI improvements #161

brullsker · 2018-06-03T11:16:27Z

I just changed some things so they look better (in my opinion). I also addressed and hopefully fixed Issue #110 .
I hope you like my contribution. Thanks, brullsker

UI change on NotificationSettingsPage

golf1052 · 2018-06-04T06:28:07Z

Signal-Windows/Views/NotificationSettingsPage.xaml

                    <RadioButton Content="Name and message" Tag="{x:Bind Vm.NameAndMessageTag}" Margin="0,6" IsChecked="{x:Bind Vm.NameAndMessageChecked, Mode=TwoWay}" Checked="ShowNotificationText_Checked"/>
                    <RadioButton Content="Name only" Tag="{x:Bind Vm.NameOnlyTag}" Margin="0,6" IsChecked="{x:Bind Vm.NameOnlyChecked, Mode=TwoWay}" Checked="ShowNotificationText_Checked"/>
-                    <RadioButton Content="No name or message" Tag="{x:Bind Vm.NoNameOrMessageTag}" Margin="0,6" IsChecked="{x:Bind Vm.NoNameOrMessageChecked, Mode=TwoWay}" Checked="ShowNotificationText_Checked"/>
+                    <RadioButton Content="No name or message" Tag="{x:Bind Vm.NoNameOrMessageTag}" Margin="0,6" IsChecked="{x:Bind Vm.NoNameOrMessageChecked, Mode=TwoWay}" Checked="ShowNotificationText_Checked"/><!--Does this mean that no notif will be shown?-->


No, this means that if you get a message you'll still get a notification but the person who sent it or the message they sent won't be in the notification.

Okay, thanks

golf1052

Looks good, I'll wait for @Trolldemorted to comment as well.

golf1052 · 2018-06-04T06:29:15Z

Signal-Windows/Views/NotificationSettingsPage.xaml

@@ -22,12 +22,12 @@
                    <RowDefinition Height="Auto"/>
                </Grid.RowDefinitions>
                <StackPanel>
-                    <TextBlock Text="Show" Style="{StaticResource BodyTextBlockStyle}" Margin="0,0,0,6"/>
+                    <TextBlock Text="Show..." Style="{StaticResource BodyTextBlockStyle}" Margin="0,0,0,6"/>


Ellipsis isn't needed. I tried to match the text from the Signal app, which doesn't use an ellipsis here.

Okay, didn't know that

golf1052 · 2018-06-04T06:31:20Z

Signal-Windows/Views/GlobalSettingsPage.xaml

@@ -29,7 +30,7 @@
            </VisualStateGroup>
        </VisualStateManager.VisualStateGroups>
        <TextBlock Text="Settings" Style="{StaticResource HeaderTextBlockStyle}" HorizontalAlignment="Center" VerticalAlignment="Center"/>
-        <VariableSizedWrapGrid x:Name="WrapGrid" HorizontalAlignment="Left" MaximumRowsOrColumns="1" VerticalAlignment="Top" Orientation="Horizontal" ItemWidth="250" ItemHeight="80" Grid.Row="1" Margin="32,0,32,0">
+        <VariableSizedWrapGrid x:Name="WrapGrid" HorizontalAlignment="Left" MaximumRowsOrColumns="1" VerticalAlignment="Top" Orientation="Horizontal" ItemWidth="250" ItemHeight="80" Grid.Row="1" Margin="32,0,32,0" animations:ReorderGridAnimation.Duration="300">


This animation seems to not work for me.

I also don't notice a difference on my W10 desktop.

Yep, seems to not work... Sorry

Trolldemorted

Thanks for your pull request!

I have added some comments for minor issues.

Trolldemorted · 2018-06-04T20:56:29Z

Signal-Windows/Controls/Conversation.xaml

@@ -132,7 +132,7 @@
                <ColumnDefinition Width="*"/>
                <ColumnDefinition Width="Auto"/>
            </Grid.ColumnDefinitions>
-            <TextBox Grid.Column="0" Name="InputTextBox" VerticalAlignment="Center" KeyDown="TextBox_KeyDown" PlaceholderText="Type a message" BorderBrush="{x:Null}" BorderThickness="0" TextWrapping="Wrap" TextChanged="InputTextBox_TextChanged" InputScope="Chat" Visibility="{x:Bind SendMessageVisible, Mode=OneWay}"/>
+            <TextBox Grid.Column="0" Name="InputTextBox" VerticalAlignment="Center" KeyDown="TextBox_KeyDown" PlaceholderText="Type a message" BorderBrush="{x:Null}" BorderThickness="0" TextWrapping="Wrap" TextChanged="InputTextBox_TextChanged" InputScope="Chat" Visibility="{x:Bind SendMessageVisible, Mode=OneWay}" Padding="10,15,6,15"/>


The previous (default) padding was 10,3,6,5. Do other chat apps on uwp also use such a big padding to north and south? If the input becomes multiline we might want to waste as little vertical space as possible

Well, changing padding was the first thing coming to my mind...

Trolldemorted · 2018-06-04T20:57:11Z

Signal-Windows/Controls/Welcome.xaml

-        <Image Source="ms-appx:///Assets/logo-idea-2.png" Width="256"/>
+        <StackPanel Orientation="Vertical">
+            <Image Source="ms-appx:///Assets/logo-idea-2.png" Width="256"/>
+            <TextBlock Text="Choose a contact to start chatting" Grid.Row="1" HorizontalAlignment="Center" Style="{StaticResource TitleTextBlockStyle}" Foreground="White" Margin="0,12,0,0"/>


Contact or group, maybe we should just say "conversation"?

Yep, sounds better

Trolldemorted · 2018-06-04T21:02:43Z

Signal-Windows/Views/AdvancedSettingsPage.xaml

+        <StackPanel Grid.Row="1" Margin="32,0,0,0" HorizontalAlignment="Left">
+            <HyperlinkButton x:Name="ExportDebugLogButton" Content="Export debug log" Click="ExportDebugLogButton_Click" HorizontalAlignment="Stretch" HorizontalContentAlignment="Left"/>
+            <HyperlinkButton x:Name="SyncButton" Content="Request contact and group sync" Margin="0,8,0,0" Click="SyncButton_Click" HorizontalAlignment="Stretch" HorizontalContentAlignment="Left"/>
+            <HyperlinkButton x:Name="TestCrashButton" Content="Intentionally crash the app to test its debug log export" Click="TestCrashButton_Click" HorizontalAlignment="Stretch" HorizontalContentAlignment="Left"/>


Why HyperlinkButtons? Do they behave/look different here?

Trolldemorted · 2018-06-04T21:03:47Z

Signal-Windows/Views/GlobalSettingsPage.xaml

@@ -29,7 +30,7 @@
            </VisualStateGroup>
        </VisualStateManager.VisualStateGroups>
        <TextBlock Text="Settings" Style="{StaticResource HeaderTextBlockStyle}" HorizontalAlignment="Center" VerticalAlignment="Center"/>
-        <VariableSizedWrapGrid x:Name="WrapGrid" HorizontalAlignment="Left" MaximumRowsOrColumns="1" VerticalAlignment="Top" Orientation="Horizontal" ItemWidth="250" ItemHeight="80" Grid.Row="1" Margin="32,0,32,0">
+        <VariableSizedWrapGrid x:Name="WrapGrid" HorizontalAlignment="Left" MaximumRowsOrColumns="1" VerticalAlignment="Top" Orientation="Horizontal" ItemWidth="250" ItemHeight="80" Grid.Row="1" Margin="32,0,32,0" animations:ReorderGridAnimation.Duration="300">


I also don't notice a difference on my W10 desktop.

Trolldemorted · 2018-06-04T21:15:33Z

Signal-Windows/Views/MainPage.xaml

@@ -32,19 +32,22 @@
                    <RowDefinition Height="Auto" />
                    <RowDefinition Height="*" />
                </Grid.RowDefinitions>
+                <Border Grid.Row="0" Background="{ThemeResource ApplicationPageBackgroundThemeBrush}"/>
+                <Border Grid.Row="0" Background="Black" Opacity="0.25"/>


The blue color was exactly the same blue the official signal clients use at that position - do we want to diverge color-wise? I think we should keep the general look so that S-W feels like an official signal client

Do you think it would look better without that black-transparent border?

Don't know tbh, let's just stick with Signal-Android/Desktops color schemes

brullsker added 12 commits June 3, 2018 10:10

UI Improvements on Add contact page

c1c5354

UI improvements on AdvancedSettingsPage

6240b42

Another UI improvement on AdvancedSettingsPage

ff3ef84

Added ReorderGridAnimation to GlobalSettingsPage

e9e4fb8

UI change on NotificationSettingsPage

UI fix NotificationSettingsPage

2e9bc88

UI improvement RegisterFinalizationPage

e5fad7e

UI improvements RegisterPage

424928c

UI imprvements StartPage

0bc8d9a

Improved UI of MainPage

6ad09ea

UI changes (improvements?) to MainPage and the Welcome control

178fd06

Send bar disabled state doesnÄt look strange anymore - fix Issue #110

5fde90d

fixed a ui failure made by me

8242da7

golf1052 reviewed Jun 4, 2018

View reviewed changes

golf1052 requested changes Jun 4, 2018

View reviewed changes

Trolldemorted requested changes Jun 4, 2018

View reviewed changes

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Some UI improvements #161

Some UI improvements #161

brullsker commented Jun 3, 2018

golf1052 Jun 4, 2018

brullsker Jun 5, 2018

golf1052 left a comment

golf1052 Jun 4, 2018

brullsker Jun 5, 2018

golf1052 Jun 4, 2018

Trolldemorted Jun 4, 2018

brullsker Jun 5, 2018

Trolldemorted left a comment

Trolldemorted Jun 4, 2018

brullsker Jun 5, 2018

Trolldemorted Jun 4, 2018

brullsker Jun 5, 2018

Trolldemorted Jun 4, 2018

Trolldemorted Jun 4, 2018

Trolldemorted Jun 4, 2018

brullsker Jun 5, 2018

Trolldemorted Jun 15, 2018

Some UI improvements #161

Are you sure you want to change the base?

Some UI improvements #161

Conversation

brullsker commented Jun 3, 2018

Choose a reason for hiding this comment

Choose a reason for hiding this comment

golf1052 left a comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Trolldemorted left a comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment