1

私のアプリケーションのリスティングページでFloatingActionButtonを使用していますが、searchBarも追加します。しかし、私はそれらのページを表示することができませんでした。私のコードとスクリーンショットがダウンしています。 searchBarを表示するにはどうすればよいですか?Xamarin Forms RelativeLayout

FAB Github

マイコード:

<ContentPage.Content> 
     <RelativeLayout> 
     <SearchBar 
      x:Name="searchBar" 
      Placeholder="Ara" 
      /> 
      <ContentView 
       RelativeLayout.WidthConstraint="{ConstraintExpression Type=RelativeToParent, Property=Width, Factor=1}" 
       RelativeLayout.HeightConstraint="{ConstraintExpression Type=RelativeToParent, Property=Height, Factor=1}"> 
       <ListView 
        x:Name="list" 
        BackgroundColor="White"> 
        <ListView.ItemTemplate> 
         <DataTemplate> 
          <TextCell 
           Text="{Binding .}" /> 
         </DataTemplate> 
        </ListView.ItemTemplate> 
       </ListView> 
      </ContentView> 
      <fab:FloatingActionButton 
       x:Name="fabBtn" 
       Source="plus.png" 
       Size="Normal" 
       Clicked="Handle_FabClicked" 
       NormalColor="Green" 
       RippleColor="Red" 
       RelativeLayout.XConstraint="{ConstraintExpression Type=RelativeToParent, Property=Width, Factor=1, Constant=-75}" 
       RelativeLayout.YConstraint="{ConstraintExpression Type=RelativeToParent, Property=Height, Factor=1, Constant=-75}" /> 
     </RelativeLayout> 
    </ContentPage.Content> 
</ContentPage> 

enter image description here

+0

iOSのフローティングアクションボタン?デザインがiOSに適していると確信していますか? – Cheesebaron

+0

はい、問題なく動作します。 – ozmert75

+0

とにかく、あなたのコードを見ると、ContentViewはSearchBarをオーバーラップさせています。そのため、あなたはそれを見ることができません。 – Cheesebaron

答えて

1

@Cheesebaronは正しいです。問題は、ビューがお互いの上にあるためです。代わりにContentViewに制約を追加して、YsearchBar以下になるようにする必要があります。 RelativeLayout.YConstraintの添加はsearchBarHeightに基づくべき

<ContentView 
      RelativeLayout.WidthConstraint="{ConstraintExpression Type=RelativeToParent, Property=Width, Factor=1}" 
      RelativeLayout.HeightConstraint="{ConstraintExpression Type=RelativeToParent, Property=Height, Factor=1}" 
      RelativeLayout.YConstraint="{ConstraintExpression Type=RelativeToView, Property=Height, ElementName=searchBar}" /> 

注:このような何かを考えてみましょう。

関連する問題