I would need to align a separator/divider line in the midlle of each Layout.
i tried do it but i can't to cross the separators.
I need to divide by group!
like this:
https://i.stack.imgur.com/thpWi.png
this is my:
https://i.stack.imgur.com/osP6P.jpg
here is my code:
<androidx.coordinatorlayout.widget.CoordinatorLayout
android:layout_height="match_parent"
android:layout_width="match_parent">
<LinearLayout
android:background="#drawable/report_main_gradient"
android:layout_height="match_parent"
android:layout_width="match_parent"
android:orientation="vertical">
<LinearLayout
android:layout_height="wrap_content"
android:layout_width="match_parent"
android:orientation="horizontal">
<LinearLayout
android:layout_height="290dp"
android:layout_weight=".5"
android:layout_width="0dp"
android:orientation="horizontal"
android:padding="#dimen/space_8">
<LinearLayout
android:layout_height="280dp"
android:layout_width="match_parent"
android:orientation="vertical">
<LinearLayout
android:layout_height="wrap_content"
android:layout_width="match_parent"
android:orientation="horizontal">
<LinearLayout
android:gravity="center_horizontal"
android:layout_height="match_parent"
android:layout_weight=".5"
android:layout_width="0dp"
android:orientation="vertical">
<LinearLayout
android:layout_height="wrap_content"
android:layout_width="wrap_content"
android:orientation="vertical">
<ImageView
android:layout_gravity="center_horizontal"
android:layout_height="wrap_content"
android:layout_width="wrap_content"
android:src="#drawable/ic_artists" />
<TextView
android:fontFamily="#font/roboto"
android:layout_gravity="center_horizontal"
android:layout_height="wrap_content"
android:layout_width="wrap_content"
android:text="Representante"
android:textColor="#color/md_white_1000"
android:textSize="#dimen/font_body_s_size" />
</LinearLayout>
<LinearLayout
android:layout_height="wrap_content"
android:layout_width="wrap_content"
android:orientation="vertical">
<ImageView
android:layout_gravity="center_horizontal"
android:layout_height="wrap_content"
android:layout_width="wrap_content"
android:src="#drawable/ic_artists" />
<TextView
android:fontFamily="#font/roboto"
android:layout_gravity="center_horizontal"
android:layout_height="wrap_content"
android:layout_width="wrap_content"
android:text="Brand"
android:textColor="#color/md_white_1000"
android:textSize="#dimen/font_body_s_size" />
</LinearLayout>
</LinearLayout>
<LinearLayout
android:gravity="center_horizontal"
android:layout_height="match_parent"
android:layout_weight=".5"
android:layout_width="0dp"
android:orientation="vertical">
<LinearLayout
android:layout_height="wrap_content"
android:layout_width="wrap_content"
android:orientation="vertical">
<ImageView
android:layout_gravity="center_horizontal"
android:layout_height="wrap_content"
android:layout_width="wrap_content"
android:src="#drawable/ic_artists" />
<TextView
android:fontFamily="#font/roboto"
android:layout_gravity="center_horizontal"
android:layout_height="wrap_content"
android:layout_width="wrap_content"
android:text="Cliente"
android:textColor="#color/md_white_1000"
android:textSize="#dimen/font_body_s_size" />
</LinearLayout>
<LinearLayout
android:layout_height="wrap_content"
android:layout_width="wrap_content"
android:orientation="vertical">
<ImageView
android:layout_gravity="center_horizontal"
android:layout_height="wrap_content"
android:layout_width="wrap_content"
android:src="#drawable/ic_artists" />
<TextView
android:fontFamily="#font/roboto"
android:layout_gravity="center_horizontal"
android:layout_height="wrap_content"
android:layout_width="wrap_content"
android:text="Sub Brand"
android:textColor="#color/md_white_1000"
android:textSize="#dimen/font_body_s_size" />
</LinearLayout>
</LinearLayout>
</LinearLayout>
<TextView
android:fontFamily="#font/roboto"
android:id="#+id/tvPositivacao"
android:layout_height="wrap_content"
android:layout_width="wrap_content"
android:text="Positivação"
android:textColor="#color/md_grey_50"
android:textSize="#dimen/font_h6_size" />
<View
android:background="#drawable/line_gradient"
android:layout_alignBottom="#+id/tvPositivacao"
android:layout_height="1dp"
android:layout_width="match_parent" />
</LinearLayout>
</LinearLayout>
<LinearLayout
android:layout_height="340dp"
android:layout_weight=".5"
android:layout_width="0dp"
android:orientation="horizontal"
android:padding="#dimen/space_8">
<LinearLayout
android:layout_height="330dp"
android:layout_width="match_parent"
android:orientation="vertical">
<LinearLayout
android:layout_height="wrap_content"
android:layout_width="match_parent"
android:orientation="horizontal">
<LinearLayout
android:gravity="center_horizontal"
android:layout_height="match_parent"
android:layout_width="match_parent"
android:orientation="vertical">
<LinearLayout
android:layout_height="wrap_content"
android:layout_width="wrap_content"
android:orientation="vertical">
<ImageView
android:layout_gravity="center_horizontal"
android:layout_height="wrap_content"
android:layout_width="wrap_content"
android:src="#drawable/ic_artists" />
<TextView
android:fontFamily="#font/roboto"
android:layout_gravity="center_horizontal"
android:layout_height="wrap_content"
android:layout_width="wrap_content"
android:text="Representante"
android:textColor="#color/md_white_1000"
android:textSize="#dimen/font_body_s_size" />
</LinearLayout>
<LinearLayout
android:layout_height="wrap_content"
android:layout_width="wrap_content"
android:orientation="vertical">
<ImageView
android:layout_gravity="center_horizontal"
android:layout_height="wrap_content"
android:layout_width="wrap_content"
android:src="#drawable/ic_artists" />
<TextView
android:fontFamily="#font/roboto"
android:layout_gravity="center_horizontal"
android:layout_height="wrap_content"
android:layout_width="wrap_content"
android:text="Brand"
android:textColor="#color/md_white_1000"
android:textSize="#dimen/font_body_s_size" />
</LinearLayout>
<LinearLayout
android:layout_height="wrap_content"
android:layout_width="wrap_content"
android:orientation="vertical">
<ImageView
android:layout_gravity="center_horizontal"
android:layout_height="wrap_content"
android:layout_width="wrap_content"
android:src="#drawable/ic_artists" />
<TextView
android:fontFamily="#font/roboto"
android:layout_gravity="center_horizontal"
android:layout_height="wrap_content"
android:layout_width="wrap_content"
android:text="Sub Brand"
android:textColor="#color/md_white_1000"
android:textSize="#dimen/font_body_s_size" />
</LinearLayout>
</LinearLayout>
</LinearLayout>
<TextView
android:fontFamily="#font/roboto"
android:layout_height="wrap_content"
android:layout_width="match_parent"
android:text="Evolução"
android:textColor="#color/md_grey_50"
android:textSize="#dimen/font_h6_size" />
<View
android:background="#drawable/line_gradient"
android:layout_height="1dp"
android:layout_width="match_parent" />
</LinearLayout>
</LinearLayout>
</LinearLayout>
<LinearLayout
android:layout_height="match_parent"
android:layout_width="match_parent"
android:orientation="horizontal">
<LinearLayout
android:layout_height="320dp"
android:layout_weight=".5"
android:layout_width="0dp"
android:orientation="horizontal"
android:padding="#dimen/space_8">
<LinearLayout
android:layout_height="300dp"
android:layout_width="match_parent"
android:orientation="vertical">
<LinearLayout
android:layout_height="wrap_content"
android:layout_width="match_parent"
android:orientation="horizontal">
<LinearLayout
android:gravity="center_horizontal"
android:layout_height="match_parent"
android:layout_weight=".5"
android:layout_width="0dp"
android:orientation="vertical">
<LinearLayout
android:layout_height="wrap_content"
android:layout_width="wrap_content"
android:orientation="vertical">
<ImageView
android:layout_gravity="center_horizontal"
android:layout_height="wrap_content"
android:layout_width="wrap_content"
android:src="#drawable/ic_artists" />
<TextView
android:fontFamily="#font/roboto"
android:layout_gravity="center_horizontal"
android:layout_height="wrap_content"
android:layout_width="wrap_content"
android:text="Comissão"
android:textColor="#color/md_white_1000"
android:textSize="#dimen/font_body_s_size" />
</LinearLayout>
<LinearLayout
android:layout_height="wrap_content"
android:layout_width="wrap_content"
android:orientation="vertical">
<ImageView
android:layout_gravity="center_horizontal"
android:layout_height="wrap_content"
android:layout_width="wrap_content"
android:src="#drawable/ic_artists" />
<TextView
android:fontFamily="#font/roboto"
android:layout_gravity="center_horizontal"
android:layout_height="wrap_content"
android:layout_width="wrap_content"
android:text="Brand"
android:textColor="#color/md_white_1000"
android:textSize="#dimen/font_body_s_size" />
</LinearLayout>
<LinearLayout
android:layout_height="wrap_content"
android:layout_width="wrap_content"
android:orientation="vertical">
<ImageView
android:layout_gravity="center_horizontal"
android:layout_height="wrap_content"
android:layout_width="wrap_content"
android:src="#drawable/ic_artists" />
<TextView
android:fontFamily="#font/roboto"
android:layout_gravity="center_horizontal"
android:layout_height="wrap_content"
android:layout_width="wrap_content"
android:text="Vendas"
android:textColor="#color/md_white_1000"
android:textSize="#dimen/font_body_s_size" />
</LinearLayout>
</LinearLayout>
<LinearLayout
android:gravity="center_horizontal"
android:layout_height="match_parent"
android:layout_weight=".5"
android:layout_width="0dp"
android:orientation="vertical">
<LinearLayout
android:layout_height="wrap_content"
android:layout_width="wrap_content"
android:orientation="vertical">
<ImageView
android:layout_gravity="center_horizontal"
android:layout_height="wrap_content"
android:layout_width="wrap_content"
android:src="#drawable/ic_artists" />
<TextView
android:fontFamily="#font/roboto"
android:layout_gravity="center_horizontal"
android:layout_height="wrap_content"
android:layout_width="wrap_content"
android:text="MKT"
android:textColor="#color/md_white_1000"
android:textSize="#dimen/font_body_s_size" />
</LinearLayout>
<LinearLayout
android:layout_height="wrap_content"
android:layout_width="wrap_content"
android:orientation="vertical">
<ImageView
android:layout_gravity="center_horizontal"
android:layout_height="wrap_content"
android:layout_width="wrap_content"
android:src="#drawable/ic_artists" />
<TextView
android:fontFamily="#font/roboto"
android:layout_gravity="center_horizontal"
android:layout_height="wrap_content"
android:layout_width="wrap_content"
android:text="Sub Brand"
android:textColor="#color/md_white_1000"
android:textSize="#dimen/font_body_s_size" />
</LinearLayout>
</LinearLayout>
</LinearLayout>
<TextView
android:fontFamily="#font/roboto"
android:layout_height="wrap_content"
android:layout_width="wrap_content"
android:text="Outros"
android:textColor="#color/md_grey_50"
android:textSize="#dimen/font_h6_size" />
<View
android:background="#drawable/line_gradient"
android:layout_height="1dp"
android:layout_width="match_parent" />
</LinearLayout>
</LinearLayout>
<LinearLayout
android:layout_height="340dp"
android:layout_weight=".5"
android:layout_width="0dp"
android:orientation="horizontal"
android:padding="#dimen/space_8">
<LinearLayout
android:layout_height="300dp"
android:layout_width="match_parent"
android:orientation="vertical">
<LinearLayout
android:layout_height="wrap_content"
android:layout_width="match_parent"
android:orientation="horizontal">
<LinearLayout
android:gravity="center_horizontal"
android:layout_height="match_parent"
android:layout_width="match_parent"
android:orientation="vertical">
<LinearLayout
android:layout_height="wrap_content"
android:layout_width="wrap_content"
android:orientation="vertical">
<ImageView
android:layout_gravity="center_horizontal"
android:layout_height="wrap_content"
android:layout_width="wrap_content"
android:src="#drawable/ic_artists" />
<TextView
android:fontFamily="#font/roboto"
android:layout_gravity="center_horizontal"
android:layout_height="wrap_content"
android:layout_width="wrap_content"
android:text="Representante"
android:textColor="#color/md_white_1000"
android:textSize="#dimen/font_body_s_size" />
</LinearLayout>
<LinearLayout
android:layout_height="wrap_content"
android:layout_width="wrap_content"
android:orientation="vertical">
<ImageView
android:layout_gravity="center_horizontal"
android:layout_height="wrap_content"
android:layout_width="wrap_content"
android:src="#drawable/ic_artists" />
<TextView
android:fontFamily="#font/roboto"
android:layout_gravity="center_horizontal"
android:layout_height="wrap_content"
android:layout_width="wrap_content"
android:text="Brand"
android:textColor="#color/md_white_1000"
android:textSize="#dimen/font_body_s_size" />
</LinearLayout>
<LinearLayout
android:layout_height="wrap_content"
android:layout_width="wrap_content"
android:orientation="vertical">
<ImageView
android:layout_gravity="center_horizontal"
android:layout_height="wrap_content"
android:layout_width="wrap_content"
android:src="#drawable/ic_artists" />
<TextView
android:fontFamily="#font/roboto"
android:layout_gravity="center_horizontal"
android:layout_height="wrap_content"
android:layout_width="wrap_content"
android:text="Sub Brand"
android:textColor="#color/md_white_1000"
android:textSize="#dimen/font_body_s_size" />
</LinearLayout>
</LinearLayout>
</LinearLayout>
<TextView
android:fontFamily="#font/roboto"
android:layout_height="wrap_content"
android:layout_width="match_parent"
android:text="Objetivo"
android:textColor="#color/md_grey_50"
android:textSize="#dimen/font_h6_size" />
<View
android:background="#drawable/line_gradient"
android:layout_height="1dp"
android:layout_width="match_parent" />
</LinearLayout>
</LinearLayout>
</LinearLayout>
</LinearLayout>
</androidx.coordinatorlayout.widget.CoordinatorLayout>
report_main_gradient.xml
<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="rectangle" >
<gradient
android:centerColor="#175375"
android:endColor="#1e2c3b"
android:gradientRadius="600"
android:startColor="#357194"
android:type="radial" >
</gradient>
</shape>
line_gradient.xml
<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="rectangle" >
<gradient
android:centerColor="#175375"
android:endColor="#357194"
android:gradientRadius="600"
android:startColor="#c5c5c5"
android:type="radial" >
</gradient>
</shape>
See Image (Use View for sepration)
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="match_parent">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1"
android:orientation="vertical">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="horizontal">
<LinearLayout
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="1"
android:gravity="center"
android:orientation="vertical">
<ImageView
android:layout_width="100dp"
android:layout_height="100dp"
android:layout_gravity="center"
android:src="#mipmap/ic_launcher"/>
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="Playlist"
android:textSize="25sp"
android:gravity="center"
android:layout_marginTop="50dp"/>
</LinearLayout>
<View
android:layout_width="1dp"
android:layout_height="match_parent"
android:background="#000"/>
<LinearLayout
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="1"
android:orientation="vertical">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1"
android:orientation="horizontal">
<LinearLayout
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="1"
android:gravity="center"
android:orientation="vertical">
<ImageView
android:layout_width="50dp"
android:layout_height="50dp"
android:layout_gravity="center"
android:src="#mipmap/ic_launcher"/>
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="Artists"
android:textSize="25sp"
android:gravity="center"
android:layout_marginTop="20dp"/>
</LinearLayout>
<View
android:layout_width="1dp"
android:layout_height="match_parent"
android:background="#000"/>
<LinearLayout
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="1"
android:gravity="center"
android:orientation="vertical">
<ImageView
android:layout_width="50dp"
android:layout_height="50dp"
android:layout_gravity="center"
android:src="#mipmap/ic_launcher"/>
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="Albums"
android:textSize="25sp"
android:gravity="center"
android:layout_marginTop="20dp"/>
</LinearLayout>
</LinearLayout>
<View
android:layout_width="match_parent"
android:layout_height="1dp"
android:background="#000"/>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1"
android:orientation="horizontal">
<LinearLayout
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="1"
android:gravity="center"
android:orientation="vertical">
<ImageView
android:layout_width="50dp"
android:layout_height="50dp"
android:layout_gravity="center"
android:src="#mipmap/ic_launcher"/>
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="Genres"
android:textSize="25sp"
android:gravity="center"
android:layout_marginTop="20dp"/>
</LinearLayout>
<View
android:layout_width="1dp"
android:layout_height="match_parent"
android:background="#000"/>
<LinearLayout
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="1"
android:gravity="center"
android:orientation="vertical">
<ImageView
android:layout_width="50dp"
android:layout_height="50dp"
android:layout_gravity="center"
android:src="#mipmap/ic_launcher"/>
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="Songs"
android:textSize="25sp"
android:gravity="center"
android:layout_marginTop="20dp"/>
</LinearLayout>
</LinearLayout>
</LinearLayout>
</LinearLayout>
</LinearLayout>
<View
android:layout_width="match_parent"
android:layout_height="1dp"
android:background="#000"/>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1"
android:orientation="vertical">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="horizontal">
<LinearLayout
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="1"
android:gravity="center"
android:orientation="vertical">
<ImageView
android:layout_width="100dp"
android:layout_height="100dp"
android:layout_gravity="center"
android:src="#mipmap/ic_launcher"/>
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="Videos"
android:textSize="25sp"
android:gravity="center"
android:layout_marginTop="50dp"/>
</LinearLayout>
<View
android:layout_width="1dp"
android:layout_height="match_parent"
android:background="#000"/>
<LinearLayout
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="1"
android:gravity="center"
android:orientation="vertical">
<ImageView
android:layout_width="100dp"
android:layout_height="100dp"
android:layout_gravity="center"
android:src="#mipmap/ic_launcher"/>
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="Photos"
android:textSize="25sp"
android:gravity="center"
android:layout_marginTop="50dp"/>
</LinearLayout>
</LinearLayout>
</LinearLayout>
</LinearLayout>
Related
I have this iframe that has a scroll inside and I need to support accessibility which works fine on android the problem is only on ios.
when I am at the top of the page inside the iframe I turn on the voiceover and wherever I press it focuses on the right element.
the thing is when I scroll I can't use accessibility by touch only by swipe.
I found a "solution" for this problem, if I set the height to 10000px the accessibility works on touch.
index.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<style>
.container {
width: 400px;
height: 400px;
background-color: yellowgreen;
}
iframe {
height: 100%;
width: 90%;
border: none;
display: block;
background-color: aqua;
}
</style>
<title>test</title>
</head>
<body>
<div class="container">
<iframe
class="iframe"
scrolling="yes"
frameborder="0"
src="./test.html"
></iframe>
</div>
</body>
</html>
test.js
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>test</title>
</head>
<body>
<div
style="display: flex; flex-direction: column; width: 100%; height: 100%"
>
<h1>0</h1>
<h1>1</h1>
<h1>2</h1>
<h1>3</h1>
<h1>4</h1>
<h1>5</h1>
<h1>6</h1>
<h1>7</h1>
<h1>8</h1>
<h1>9</h1>
<h1>10</h1>
<h1>11</h1>
<h1>12</h1>
<h1>13</h1>
<h1>14</h1>
<h1>15</h1>
<h1>16</h1>
<h1>17</h1>
<h1>18</h1>
<h1>19</h1>
<h1>20</h1>
<h1>21</h1>
<h1>22</h1>
<h1>23</h1>
<h1>24</h1>
<h1>25</h1>
<h1>26</h1>
<h1>27</h1>
<h1>28</h1>
<h1>29</h1>
<h1>30</h1>
<h1>31</h1>
<h1>32</h1>
<h1>33</h1>
<h1>34</h1>
<h1>35</h1>
<h1>36</h1>
<h1>37</h1>
<h1>38</h1>
<h1>39</h1>
<h1>40</h1>
<h1>41</h1>
<h1>42</h1>
<h1>43</h1>
<h1>44</h1>
<h1>45</h1>
<h1>46</h1>
<h1>47</h1>
<h1>48</h1>
<h1>49</h1>
<h1>50</h1>
</div>
</body>
</html>
is it possible to change the color of the bottom bar?
I would like to color it white. Do you have any ideas?
Goal:
return (
<Fragment>
<SafeAreaView style={{ flex: 0, backgroundColor: "red" }} />
<SafeAreaView style={{ flex: 1, backgroundColor: "white" }}>
<View style={styles.app}>
<View style={styles.header}>
<Image
accessibilityLabel="React logo"
source={{ uri: logoUri }}
resizeMode="contain"
style={styles.logo}
/>
</View>
<Text style={styles.text}>
This is an example of an app built with{" "}
</Text>
<Text style={styles.text}>To get started, edit .</Text>
<Button onPress={() => {}} title="Example button" />
</View>
</SafeAreaView>
</Fragment>
Can You try this?
I have three pickers on screen and I am trying to align text using position absolute and setting top and left values. Screenshot here
Position absolute won't work for different screen sizes as it hard coded. Any suggestions please?
I am trying to achieve timer style layout in iPhone iPhone timer screen
Code excerpt below
<View
style={{
flex: 1,
flexDirection: 'row',
justifyContent: 'space-between'
}}
>
<View style={{ flex: 1 }}>
<Picker
selectedValue={this.state.pickerValueA}
onValueChange={(value) => {
this.setState({ pickerValueA: value });
}}
itemStyle={{ color: 'black' }}
>
<Picker.Item label="30" value="30" />
<Picker.Item label="31" value="31" />
<Picker.Item label="32" value="32" />
<Picker.Item label="33" value="33" />
<Picker.Item label="34" value="34" />
<Picker.Item label="35" value="35" />
</Picker>
</View>
</View>
<Text
style={{
textAlign: 'center',
position: 'absolute',
top: 95,
left: 90,
fontWeight: 'bold',
fontSize: 20
}}
>
Text 1
</Text>
I really don't understand what I am doing wrong here. I've designed a very very simple .xib file that show a textview and a button. In the designer it works just fine. Scaling works just as would expect it. But when I run the program in the simulator I only get an empty screen. A few times I have seen the lower part of the button just beneath the navigation bar which leads me to the conclusion that the views must be somewhere at the top outside the viewable area.
As you can see in the images below I've added several constraints to the views that scale the views in the designer just fine. I've tried adding top spacing. Contain the views in a StackView but nothing seems to do the trick. What am I missing?
Here's the code that start the view using MvvmCross.
/// <summary>
/// Call the MvvmCross ShowViewModel method
/// </summary>
public bool Show<TViewModel>(IMvxBundle presentationBundle = null)
where TViewModel : IMvxViewModel
{
return base.ShowViewModel<TViewModel>(presentationBundle: presentationBundle);
}
/// <summary>
/// Show a view with viewmodel
/// </summary>
public bool Show<TViewModel>()
where TViewModel : IMvxViewModel
{
return Show<TViewModel>();
}
The presentation is handled in a custom viewpresenter:
using MvvmCross.Core.ViewModels;
using MvvmCross.iOS.Views;
using MvvmCross.iOS.Views.Presenters;
using MvvmCross.Platform;
using Notifier.Classes;
using Notifier.Interfaces;
using UIKit;
using static Notifier.Classes.ViewModelController;
namespace Notifier.iOS.Classes.MvvmCross
{
public class ViewPresenter : MvxIosViewPresenter
{
private IMvxIosViewCreator _viewCreator;
private IPlatformLog _log;
private IPlatformLog Log => _log == null ? _log = Mvx.Resolve<IPlatformLog>() : _log;
protected IMvxIosViewCreator ViewCreator
{
get { return _viewCreator ?? (_viewCreator = Mvx.Resolve<IMvxIosViewCreator>()); }
}
public ViewPresenter(IUIApplicationDelegate applicationDelegate, UIWindow window)
: base(applicationDelegate, window)
{
}
public override void Show(MvxViewModelRequest request)
{
base.Show(request);
}
}
}
Here's the content of the .xib:
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<document type="com.apple.InterfaceBuilder3.CocoaTouch.XIB" version="3.0" toolsVersion="12120" systemVersion="16F73" targetRuntime="iOS.CocoaTouch" propertyAccessControl="none" useAutolayout="YES" useTraitCollections="YES" colorMatched="YES">
<dependencies>
<plugIn identifier="com.apple.InterfaceBuilder.IBCocoaTouchPlugin" version="12088"/>
<capability name="documents saved in the Xcode 8 format" minToolsVersion="8.0"/>
</dependencies>
<objects>
<placeholder placeholderIdentifier="IBFilesOwner" id="-1" userLabel="File's Owner" customClass="HomeView">
<connections>
<outlet property="view" destination="2" id="RRd-Eg-VrN"/>
<outlet property="Registration" destination="11" id="name-outlet-11"/>
</connections>
</placeholder>
<placeholder placeholderIdentifier="IBFirstResponder" id="-2" customClass="UIResponder"/>
<view contentMode="scaleToFill" id="2" horizontalHuggingPriority="1">
<rect key="frame" x="0.0" y="0.0" width="600" height="600"/>
<autoresizingMask key="autoresizingMask" flexibleMaxX="YES" flexibleMaxY="YES"/>
<color key="backgroundColor" red="1" green="1" blue="1" alpha="1" colorSpace="custom" customColorSpace="sRGB"/>
<subviews>
<textView clipsSubviews="YES" multipleTouchEnabled="YES" contentMode="scaleToFill" textAlignment="natural" id="10" translatesAutoresizingMaskIntoConstraints="NO">
<rect key="frame" x="16" y="16" width="568" height="128"/>
<color key="backgroundColor" white="1" alpha="1" colorSpace="calibratedWhite"/>
<string key="text">Lorem ipsum dolor sit er elit lamet, consectetaur cillium adipisicing pecu, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum. Nam liber te conscient to factor tum poen legum odioque civiuda.</string>
<fontDescription key="fontDescription" type="system" pointSize="14"/>
<textInputTraits key="textInputTraits" autocapitalizationType="sentences"/>
</textView>
<button opaque="NO" contentMode="scaleToFill" contentHorizontalAlignment="center" contentVerticalAlignment="center" buttonType="roundedRect" lineBreakMode="middleTruncation" id="11" translatesAutoresizingMaskIntoConstraints="NO">
<rect key="frame" x="16" y="188" width="568" height="30"/>
<state key="normal" title="Button">
<color key="titleShadowColor" white="0.5" alpha="1" colorSpace="calibratedWhite"/>
</state>
</button>
</subviews>
<constraints>
<constraint id="14" firstItem="2" firstAttribute="trailing" secondItem="10" secondAttribute="trailing" constant="16"/>
<constraint id="15" firstItem="10" firstAttribute="leading" secondItem="2" secondAttribute="leading" constant="16"/>
<constraint id="16" firstItem="11" firstAttribute="leading" secondItem="2" secondAttribute="leading" constant="16"/>
<constraint id="17" firstItem="2" firstAttribute="trailing" secondItem="11" secondAttribute="trailing" constant="16"/>
</constraints>
</view>
</objects>
<simulatedMetricsContainer key="defaultSimulatedMetrics">
<simulatedScreenMetrics key="destination" type="retina47"/>
</simulatedMetricsContainer>
</document>
This is the generic view in the designer:
This is the designer for a specifice iPhone:
And this is what I see in the simulator:
It should be due to constraints problem. Please check whether your constraint is define correctly. When the constraint is define correctly, you should see blue lines only when select your view in xib.
From your screenshots, you are only defining leading and trailing constraints. Please also define the top and height constraint.
Trying to style a button using Pixate and MvvmCross in a Xamarin application. The class selector does not seem to work. You can see that the main button class does not set the font color to yellow and the background of the button is not blue
Has anyone worked with pixate and MvvmCross and found a solution to this issue?
defalut.css
button {
font-size: 30px;
border-radius: 15px;
border-width: 2px;
border-color: lightgray;
}
/* Cannot seem to get class selector to work with mvvm cross */
.mainbutton {
color: yellow;
background-color: blue;
}
main.xaml
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:local="http://schemas.android.com/apk/res-auto"
android:orientation="vertical"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:minWidth="25px"
android:minHeight="25px">
<Button
android:text="Test One"
android:layout_width="match_parent"
android:layout_height="wrap_content"
class="mainbutton"
local:MvxBind="Click CommandOne" />
</LinearLayout>