BottomBarBackground Problem

Bug Reports
1

Hi,

I’m learning FUSE, I feel great, but I have a problem with BottomBarBackground, It does not work well in my LG G4:

the two blue buttons should always be visible as in the preview of my PC

file
file1440×2560

My Code:

<App Theme="Basic" ClearColor="#eeeeeeff">
    <DockPanel>
        <StatusBarBackground DockPanel.Dock="Top" />
        <ScrollView ClipToBounds="true">
            <StackPanel>
                <Panel ux:Name="panel1" Height="80" Background="#F44336" />
                <Panel Height="200" Background="#ddd"/>
                <Panel Height="200" Background="#bbb"/>
                <Panel Height="200" Background="#999"/>
                <Panel Height="200" Background="#777"/>
                <Panel Height="200" Background="#444"/>
                <Panel ux:Name="panel2" Height="80" Background="#3949AB" />
            </StackPanel>
        </ScrollView>
        <StackPanel Dock="Bottom" Height="60" Orientation="Horizontal" Alignment="Center">
            <Button Text="To the top">
                <Clicked>
                    <BringIntoView TargetNode="panel1" />
                </Clicked>
            </Button>
            <Button Text="To the bottom">
                <Clicked>
                    <BringIntoView TargetNode="panel2" />
                </Clicked>
            </Button>
        </StackPanel>
        <BottomBarBackground DockPanel.Dock="Bottom"/>
    </DockPanel>
</App>

My Phone:

–Support Info-- Debug info: LC: PE LG: es Context: settings/about Carrier: Claro Manufacturer: LGE Model: LG-H815 OS: 5.1 Socket Conn: UP Radio MCC-MNC: 716-10 SIM MCC-MNC: 716-10 Free Space Built-In: 14733684736 (13.72 GB) Free Space Removable: 14733684736 (13.72 GB) FAQ Results Returned: 10 FAQ Results Read: 0 Web session: token saved Target: release Distribution: play Product: p1_global_com Device: p1 Build: LMY47D Kernel: 3.10.49-ga116b80 #1 SMP PREEMPT Mon Sep 28 18:49:47 BRT 2015 Connection: M.O.B.I.L.E. (L.T.E.) Device ISO8601: 2015-12-16 21:15:46.244-0500 Phone Type: G.S.M. Network Type: L.T.E. Diagnostic Codes: FE-GDE FE-GDC Network metered: 126:true Network restricted: 126:false Data roaming: false Tel roaming: false

2

Panels are docked in the order they appear in the UX file (earlier items will be closer to the outside of the DockPanel). So what you’ve inadvertently done is put the BottomFrameBackground above the StackPanel. Try moving the BottomFrameBackground to earlier in the DockPanel. It can come right after the TopFrameBackground if you want.

These are the newer names for the StatusBarBackground and BottomBarBackground, which will eventually be deprecated.

3

thanks for the help, and I understood the problem. I have only one question which is the difference to use:

<App Theme="Basic">
  <DockPanel>
    <StatusBarBackground DockPanel.Dock="Top" />
    <BottomBarBackground DockPanel.Dock="Bottom"/>

  </DockPanel>
</App>

or use this:

<App Theme="Basic">
  <ClientPanel>

  </ClientPanel>
</App>
4 
<App Theme="Basic">
  <DockPanel>
  <StatusBarBackground DockPanel.Dock="Top" />
  <BottomBarBackground DockPanel.Dock="Bottom"/>

  </DockPanel>
</App>

<App Theme="Basic">
  <ClientPanel>

  </ClientPanel>
</App>

<ClientPanel /> is a DockPanel with the Status/BottomBarBackgrounds already added and docked. So the only difference between using the two would be that you can control the drawing order (if you put children before the Status/BottomBar)