Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

NavView OpenPaneLength Surpassing App Width Fix #5800

Merged
merged 5 commits into from
Sep 2, 2021
Merged

NavView OpenPaneLength Surpassing App Width Fix #5800

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
5 commits
Select commit Hold shift + click to select a range
a3e0fbf
add openpanewith member variable + templateSettings prop
karkarl Aug 31, 2021
8fa6616
assign min of openPaneLength / app width
karkarl Aug 31, 2021
28f5dfb
update verification files
karkarl Aug 31, 2021
9199c82
changes from comments
karkarl Sep 2, 2021
1da7103
move openPaneWidth to preview
karkarl Sep 2, 2021
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
26 changes: 26 additions & 0 deletions dev/Generated/NavigationViewTemplateSettings.properties.cpp
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -15,6 +15,7 @@ namespace winrt::Microsoft::UI::Xaml::Controls

GlobalDependencyProperty NavigationViewTemplateSettingsProperties::s_BackButtonVisibilityProperty{ nullptr };
GlobalDependencyProperty NavigationViewTemplateSettingsProperties::s_LeftPaneVisibilityProperty{ nullptr };
GlobalDependencyProperty NavigationViewTemplateSettingsProperties::s_OpenPaneWidthProperty{ nullptr };
GlobalDependencyProperty NavigationViewTemplateSettingsProperties::s_OverflowButtonVisibilityProperty{ nullptr };
GlobalDependencyProperty NavigationViewTemplateSettingsProperties::s_PaneToggleButtonVisibilityProperty{ nullptr };
GlobalDependencyProperty NavigationViewTemplateSettingsProperties::s_PaneToggleButtonWidthProperty{ nullptr };
Expand Down Expand Up @@ -52,6 +53,17 @@ void NavigationViewTemplateSettingsProperties::EnsureProperties()
ValueHelper<winrt::Visibility>::BoxValueIfNecessary(winrt::Visibility::Visible),
nullptr);
}
if (!s_OpenPaneWidthProperty)
{
s_OpenPaneWidthProperty =
InitializeDependencyProperty(
L"OpenPaneWidth",
winrt::name_of<double>(),
winrt::name_of<winrt::NavigationViewTemplateSettings>(),
false /* isAttached */,
ValueHelper<double>::BoxValueIfNecessary(320.0),
nullptr);
}
if (!s_OverflowButtonVisibilityProperty)
{
s_OverflowButtonVisibilityProperty =
Expand Down Expand Up @@ -135,6 +147,7 @@ void NavigationViewTemplateSettingsProperties::ClearProperties()
{
s_BackButtonVisibilityProperty = nullptr;
s_LeftPaneVisibilityProperty = nullptr;
s_OpenPaneWidthProperty = nullptr;
s_OverflowButtonVisibilityProperty = nullptr;
s_PaneToggleButtonVisibilityProperty = nullptr;
s_PaneToggleButtonWidthProperty = nullptr;
Expand Down Expand Up @@ -170,6 +183,19 @@ winrt::Visibility NavigationViewTemplateSettingsProperties::LeftPaneVisibility()
return ValueHelper<winrt::Visibility>::CastOrUnbox(static_cast<NavigationViewTemplateSettings*>(this)->GetValue(s_LeftPaneVisibilityProperty));
}

void NavigationViewTemplateSettingsProperties::OpenPaneWidth(double value)
{
[[gsl::suppress(con)]]
{
static_cast<NavigationViewTemplateSettings*>(this)->SetValue(s_OpenPaneWidthProperty, ValueHelper<double>::BoxValueIfNecessary(value));
}
}

double NavigationViewTemplateSettingsProperties::OpenPaneWidth()
{
return ValueHelper<double>::CastOrUnbox(static_cast<NavigationViewTemplateSettings*>(this)->GetValue(s_OpenPaneWidthProperty));
}

void NavigationViewTemplateSettingsProperties::OverflowButtonVisibility(winrt::Visibility const& value)
{
[[gsl::suppress(con)]]
Expand Down
5 changes: 5 additions & 0 deletions dev/Generated/NavigationViewTemplateSettings.properties.h
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -15,6 +15,9 @@ class NavigationViewTemplateSettingsProperties
void LeftPaneVisibility(winrt::Visibility const& value);
winrt::Visibility LeftPaneVisibility();

void OpenPaneWidth(double value);
double OpenPaneWidth();

void OverflowButtonVisibility(winrt::Visibility const& value);
winrt::Visibility OverflowButtonVisibility();

Expand All @@ -38,6 +41,7 @@ class NavigationViewTemplateSettingsProperties

static winrt::DependencyProperty BackButtonVisibilityProperty() { return s_BackButtonVisibilityProperty; }
static winrt::DependencyProperty LeftPaneVisibilityProperty() { return s_LeftPaneVisibilityProperty; }
static winrt::DependencyProperty OpenPaneWidthProperty() { return s_OpenPaneWidthProperty; }
static winrt::DependencyProperty OverflowButtonVisibilityProperty() { return s_OverflowButtonVisibilityProperty; }
static winrt::DependencyProperty PaneToggleButtonVisibilityProperty() { return s_PaneToggleButtonVisibilityProperty; }
static winrt::DependencyProperty PaneToggleButtonWidthProperty() { return s_PaneToggleButtonWidthProperty; }
Expand All @@ -48,6 +52,7 @@ class NavigationViewTemplateSettingsProperties

static GlobalDependencyProperty s_BackButtonVisibilityProperty;
static GlobalDependencyProperty s_LeftPaneVisibilityProperty;
static GlobalDependencyProperty s_OpenPaneWidthProperty;
static GlobalDependencyProperty s_OverflowButtonVisibilityProperty;
static GlobalDependencyProperty s_PaneToggleButtonVisibilityProperty;
static GlobalDependencyProperty s_PaneToggleButtonWidthProperty;
Expand Down
28 changes: 22 additions & 6 deletions dev/NavigationView/NavigationView.cpp
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -1388,6 +1388,7 @@ void NavigationView::OnLayoutUpdated(const winrt::IInspectable& sender, const wi
void NavigationView::OnSizeChanged(winrt::IInspectable const& /*sender*/, winrt::SizeChangedEventArgs const& args)
{
const auto width = args.NewSize().Width;
UpdateOpenPaneWidth(width);
UpdateAdaptiveLayout(width);
UpdateTitleBarPadding();
UpdateBackAndCloseButtonsVisibility();
Expand All @@ -1399,6 +1400,17 @@ void NavigationView::OnItemsContainerSizeChanged(const winrt::IInspectable& send
UpdatePaneLayout();
}

void NavigationView::UpdateOpenPaneWidth(double width)
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

This probably needs to be called in OnApplyTemplate as well.

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

SizeChanged is called on load, which in turn calls UpdateOpenPaneWidth. I tested it on load with a smaller window size and it updates openPaneLength properly.

{
if (!IsTopNavigationView() && m_rootSplitView)
{
m_openPaneWidth = std::max(0.0, std::min(width, OpenPaneLength()));

const auto templateSettings = GetTemplateSettings();
templateSettings->OpenPaneWidth(m_openPaneWidth);
}
}

// forceSetDisplayMode: On first call to SetDisplayMode, force setting to initial values
void NavigationView::UpdateAdaptiveLayout(double width, bool forceSetDisplayMode)
{
Expand Down Expand Up @@ -4032,6 +4044,10 @@ void NavigationView::OnPropertyChanged(const winrt::DependencyPropertyChangedEve
{
UpdatePaneLayout();
}
else if (property == s_OpenPaneLengthProperty)
{
UpdateOpenPaneWidth(ActualWidth());
}
}

void NavigationView::UpdateNavigationViewItemsFactory()
Expand Down Expand Up @@ -4390,13 +4406,13 @@ void NavigationView::UpdatePaneToggleSize()
{
if (splitView.DisplayMode() == winrt::SplitViewDisplayMode::Overlay && IsPaneOpen())
{
width = OpenPaneLength();
togglePaneButtonWidth = OpenPaneLength() - ((ShouldShowBackButton() || ShouldShowCloseButton()) ? c_backButtonWidth : 0);
width = m_openPaneWidth;
togglePaneButtonWidth = m_openPaneWidth - ((ShouldShowBackButton() || ShouldShowCloseButton()) ? c_backButtonWidth : 0);
}
else if (!(splitView.DisplayMode() == winrt::SplitViewDisplayMode::Overlay && !IsPaneOpen()))
{
width = OpenPaneLength();
togglePaneButtonWidth = OpenPaneLength();
width = m_openPaneWidth;
togglePaneButtonWidth = m_openPaneWidth;
}
}

Expand Down Expand Up @@ -4878,11 +4894,11 @@ void NavigationView::UpdatePaneShadow()
// Ensure shadow is as wide as the pane when it is open
if (DisplayMode() == winrt::NavigationViewDisplayMode::Compact)
{
shadowReceiver.Width(OpenPaneLength());
shadowReceiver.Width(m_openPaneWidth);
}
else
{
shadowReceiver.Width(OpenPaneLength() - shadowReceiverMargin.Right);
shadowReceiver.Width(m_openPaneWidth - shadowReceiverMargin.Right);
}
shadowReceiver.Margin(shadowReceiverMargin);
}
Expand Down
3 changes: 3 additions & 0 deletions dev/NavigationView/NavigationView.h
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -251,6 +251,7 @@ class NavigationView :
void OnItemsContainerSizeChanged(const winrt::IInspectable& sender, const winrt::SizeChangedEventArgs& args);
void OnLayoutUpdated(const winrt::IInspectable& sender, const winrt::IInspectable& e);
void UpdateAdaptiveLayout(double width, bool forceSetDisplayMode = false);
void UpdateOpenPaneWidth(double width);
void UpdatePaneLayout();
void SetDisplayMode(const winrt::NavigationViewDisplayMode& displayMode, bool forceSetDisplayMode = false);

Expand Down Expand Up @@ -499,5 +500,7 @@ class NavigationView :
bool m_TabKeyPrecedesFocusChange{ false };

bool m_isLeftPaneTitleEmpty{ false };

double m_openPaneWidth{ 320.0 };
};

10 changes: 9 additions & 1 deletion dev/NavigationView/NavigationView.idl
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -142,7 +142,7 @@ unsealed runtimeclass NavigationViewTemplateSettings : Windows.UI.Xaml.Dependenc
Windows.UI.Xaml.Visibility LeftPaneVisibility { get; };
Boolean SingleSelectionFollowsFocus { get; };
Double PaneToggleButtonWidth{ get; };
Double SmallerPaneToggleButtonWidth{ get; };
Double SmallerPaneToggleButtonWidth{ get; };

static Windows.UI.Xaml.DependencyProperty TopPaddingProperty { get; };
static Windows.UI.Xaml.DependencyProperty OverflowButtonVisibilityProperty { get; };
Expand All @@ -153,6 +153,14 @@ unsealed runtimeclass NavigationViewTemplateSettings : Windows.UI.Xaml.Dependenc
static Windows.UI.Xaml.DependencyProperty SingleSelectionFollowsFocusProperty { get; };
static Windows.UI.Xaml.DependencyProperty PaneToggleButtonWidthProperty{ get; };
static Windows.UI.Xaml.DependencyProperty SmallerPaneToggleButtonWidthProperty{ get; };

[MUX_PREVIEW]
{
[MUX_DEFAULT_VALUE("320.0")]
Double OpenPaneWidth{ get; };

static Windows.UI.Xaml.DependencyProperty OpenPaneWidthProperty{ get; };
}
}

[MUX_PUBLIC]
Expand Down
4 changes: 2 additions & 2 deletions dev/NavigationView/NavigationView.xaml
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -469,7 +469,7 @@
DisplayMode="Inline"
IsPaneOpen="{Binding RelativeSource={RelativeSource TemplatedParent}, Path=IsPaneOpen, Mode=TwoWay}"
IsTabStop="False"
OpenPaneLength="{TemplateBinding OpenPaneLength}"
OpenPaneLength="{Binding RelativeSource={RelativeSource TemplatedParent}, Path=TemplateSettings.OpenPaneWidth}"
PaneBackground="{ThemeResource NavigationViewDefaultPaneBackground}"
Grid.Row="1"
contract7Present:CornerRadius="{Binding Source={ThemeResource OverlayCornerRadius}, Converter={StaticResource RightCornerRadiusFilterConverter}}">
Expand Down Expand Up @@ -683,7 +683,7 @@
<Grid
x:Name="ShadowCaster"
Grid.RowSpan="2"
Width="{TemplateBinding OpenPaneLength}"
Width="{Binding RelativeSource={RelativeSource TemplatedParent}, Path=TemplateSettings.OpenPaneWidth}"
HorizontalAlignment="Left">
<Grid.RenderTransform>
<CompositeTransform x:Name="ShadowCasterTransform" />
Expand Down
Loading