Custom ListPopupWindow rendered in different widths - xamarin

I am using Android.Support.V7.Widget.ListPopupWindow as a Drop-Down Menu from a Button within my layout. Here is the code snippet I am using
void MenuIcon_Click (object sender, EventArgs e)
{
popupWindow = new Android.Support.V7.Widget.ListPopupWindow (this);
popupAdapter = new MenuPopUpAdapter (this,selectedIndex,menuList);
popupAdapter.ItemClick+= PopupAdapter_ItemClick;
popupWindow.SetAdapter (popupAdapter);
popupWindow.AnchorView = menuButton;
Display display = WindowManager.DefaultDisplay;
Point size = new Point();
display.GetSize (size);
int width = size.X;
popupWindow.Width =160;
popupWindow.Show ();
}
But while debugging I noted that, even though I have given it a static width, it is rendered differently in different devices. What is causing this issue ?

This is because of the different screen densities in Android devices. You need to mention dimensions in DPs(Density Independent Pixels) to overcome this issue. This documentation from Google will be a nice read
You can get the corresponding pixel value to be mentioned while setting dimensions programatically from this method.
public int dpToPx(int dp) {
DisplayMetrics displayMetrics = Resources.DisplayMetrics;
int px = (int)Math.Round(dp * (displayMetrics.Density));
return px;
}
You may modify the code as above to fix the issue
popupWindow.Width =dpToPx(160);

Related

Label is not show in print

I have used below code to print the Panel of windows form.
private void button1_Click(object sender, EventArgs e)
{
System.Drawing.Printing.PrintDocument doc = new System.Drawing.Printing.PrintDocument();
doc.PrintPage += new System.Drawing.Printing.PrintPageEventHandler(Doc_PrintPage);
doc.Print();
}
private void Doc_PrintPage(object sender, PrintPageEventArgs e)
{
Panel grd = new Panel();
Bitmap bmp = new Bitmap(panel2.Width, panel2.Height, panel2.CreateGraphics());
panel2.DrawToBitmap(bmp, new Rectangle(0, 0, panel2.Width, panel2.Height));
RectangleF bounds = e.PageSettings.PrintableArea;
float factor = ((float)bmp.Height / (float)bmp.Width);
e.Graphics.DrawImage(bmp, bounds.Left, bounds.Top, bounds.Width, factor * bounds.Width);
bmp.Save("test12.jpg");
}
Now from above code, when i click on button the print function will be call but it excluded label in it. i am attaching image for your reference. first image is my UI design. , when i use print functionality it removes the label value as you can see in other image. i have used rectagleshap control which are in Pink color and i am displaying label on it. I think the label may be send back but when i used front back then also it is not appear.
Can you just try this one here i was using this for capture the whole screen which ever is active window its like screencapture or screenshot.
private void Doc_PrintPage(object sender, PrintPageEventArgs e)
{
Bitmap bitmap = new Bitmap(panel2.Width, panel2.Height);
Graphics graphics = Graphics.FromImage(bitmap as Image);
graphics.InterpolationMode = InterpolationMode.Default;
graphics.CopyFromScreen(0, 0, 0, 0, bitmap.Size);
bitmap.Save(pathDownload + filename + ".jpeg", ImageFormat.Jpeg);
bmp.Save("test12.jpg");
}
In my case label was shown back to the rectangle, so i added one more label and set it as bring front. thanks for the help.

Scale UI for multiple resolutions/different devices

I have a quite simple unity GUI that has the following scheme :
Where Brekt and so are buttons.
The GUI works just fine on PC and is on screen space : overlay so it is supposed to be adapted automatically to fit every screen.
But on tablet the whole GUI is smaller and reduced in the center of the screen, with huge margins around the elements (can't join a screenshot now)
What is the way to fix that? Is it something in player settings or in project settings?
Automatically scaling the UI requires using combination of anchor,pivot point of RecTransform and the Canvas Scaler component. It is hard to understand it without images or videos. It is very important that you thoroughly understand how to do this and Unity provided full video tutorial for this.You can watch it here.
Also, when using scrollbar, scrollview and other similar UI controls, the ContentSizeFitter component is also used to make sure they fit in that layout.
There is a problem with MovementRange. We must scale this value too.
I did it so:
public int MovementRange = 100;
public AxisOption axesToUse = AxisOption.Both; // The options for the axes that the still will use
public string horizontalAxisName = "Horizontal"; // The name given to the horizontal axis for the cross platform input
public string verticalAxisName = "Vertical"; // The name given to the vertical axis for the cross platform input
private int _MovementRange = 100;
Vector3 m_StartPos;
bool m_UseX; // Toggle for using the x axis
bool m_UseY; // Toggle for using the Y axis
CrossPlatformInputManager.VirtualAxis m_HorizontalVirtualAxis; // Reference to the joystick in the cross platform input
CrossPlatformInputManager.VirtualAxis m_VerticalVirtualAxis; // Reference to the joystick in the cross platform input
void OnEnable()
{
CreateVirtualAxes();
}
void Start()
{
m_StartPos = transform.position;
Canvas c = GetComponentInParent<Canvas>();
_MovementRange = (int)(MovementRange * c.scaleFactor);
Debug.Log("Range:"+ _MovementRange);
}
void UpdateVirtualAxes(Vector3 value)
{
var delta = m_StartPos - value;
delta.y = -delta.y;
delta /= _MovementRange;
if (m_UseX)
{
m_HorizontalVirtualAxis.Update(-delta.x);
}
if (m_UseY)
{
m_VerticalVirtualAxis.Update(delta.y);
}
}
void CreateVirtualAxes()
{
// set axes to use
m_UseX = (axesToUse == AxisOption.Both || axesToUse == AxisOption.OnlyHorizontal);
m_UseY = (axesToUse == AxisOption.Both || axesToUse == AxisOption.OnlyVertical);
// create new axes based on axes to use
if (m_UseX)
{
m_HorizontalVirtualAxis = new CrossPlatformInputManager.VirtualAxis(horizontalAxisName);
CrossPlatformInputManager.RegisterVirtualAxis(m_HorizontalVirtualAxis);
}
if (m_UseY)
{
m_VerticalVirtualAxis = new CrossPlatformInputManager.VirtualAxis(verticalAxisName);
CrossPlatformInputManager.RegisterVirtualAxis(m_VerticalVirtualAxis);
}
}
public void OnDrag(PointerEventData data)
{
Vector3 newPos = Vector3.zero;
if (m_UseX)
{
int delta = (int)(data.position.x - m_StartPos.x);
delta = Mathf.Clamp(delta, -_MovementRange, _MovementRange);
newPos.x = delta;
}
if (m_UseY)
{
int delta = (int)(data.position.y - m_StartPos.y);
delta = Mathf.Clamp(delta, -_MovementRange, _MovementRange);
newPos.y = delta;
}
transform.position = new Vector3(m_StartPos.x + newPos.x, m_StartPos.y + newPos.y, m_StartPos.z + newPos.z);
UpdateVirtualAxes(transform.position);
}

Xamarin Forms fade to hidden?

In my current app, I have a bunch of buttons which can hide or show their corresponding stackLayout.
First, i tried using IsVisble property, but this causes a flash,
now im at using LayoutTo() which also flashes?
My code is as below:
async void btnStrike_Clicked(object sender, EventArgs args)
{
var layout = this.FindByName<StackLayout>("stkStrikeInfo");
var rect = new Rectangle(layout.X, layout.Y, layout.Width, layout.Height - layout.Height);
await layout.LayoutTo(rect, 2500, Easing.Linear);
}
Id like to animate the height!
Edit:
I found the following piece of code, which removes the Stacklayout from the page.
The issue now is that the view isnt updating?
I think you'll have better luck with just a default animation that reduces the height of the layout you want to hide to zero.
void btnStrike_Clicked(object sender, EventArgs args)
{
// get reference to the layout to animate
var layout = this.FindByName<StackLayout>("stkStrikeInfo");
// setup information for animation
Action<double> callback = input => { layout.HeightRequest = input; }; // update the height of the layout with this callback
double startingHeight = layout.Height; // the layout's height when we begin animation
double endingHeight = 0; // final desired height of the layout
uint rate = 16; // pace at which aniation proceeds
uint length = 1000; // one second animation
Easing easing = Easing.CubicOut; // There are a couple easing types, just tried this one for effect
// now start animation with all the setup information
layout.Animate("invis", callback, startingHeight, endingHeight, rate, length, easing);
}
If the layout is already hidden and you want to show it, you would replace
double startingHeight = layout.Height;
double endingHeight = 0;
with
double startingHeight = 0;
double endingHeight = 55;
The 55 is just an arbitrary height, if you want it to go back to the height from before, you would save the previous height to a variable before you hide it and use that saved height instead of 55.

Dynamically change the font size in webbrowser in wp7

Could anyone please help me , how I can programmatically increase or decrease the font size of web browser control in windows phone 7 c sharp . I need this to implement the zoom functionality in web browser control.
here is my code
private void btn_zoomin_click(object sender, EventArgs e)
{
double fs = webBrowser1.FontSize;
webBrowser1.FontSize = fs+10;
}
But the font is not being changed at all.
Any kind of help will be appreciated.
Many thanks,
Munazza
Yes there is a solution, you can fire a script inside the html page to enlarge the font by using the webBrowser's "InvokeScript" , here is a sample:
webBrowser1.InvokeScript("ChangeFontSize","12");
TO DO : a script inside the html :
<script type="text/javascript">
function ChangeFontSize(size) {
.....
....
return true;
}
<script/>
I don't think it's supposed to work this way.
The user can zoom in and out like he does in the Internet Explorer, but you can't change the font size.
You could, technically, get the html file that you want to display, parse it and if the fontsize is defined inline, you could change it and then display the new html file in the WebBrowser control, but I don't think that's a very good idea.
You have to use WebBrowser.InvokeScript:
// Initial text size
int textSize = 100;
private void TextPlusOnClick(object sender, EventArgs e)
{
textSize *= 2;
string szfn = "{styleText = \"body { -ms-text-size-adjust:" + textSize + "% }\";styleTextNode = document.createTextNode(styleText);styleNode = document.createElement(\"style\");styleNode.appendChild(styleTextNode);document.getElementsByTagName(\"head\")[0].appendChild(styleNode);};";
webBrowser.InvokeScript("eval", szfn);
}
private void TextMinusOnClick(object sender, EventArgs e)
{
textSize /= 2;
string szfn = "{styleText = \"body { -ms-text-size-adjust:" + textSize + "% }\";styleTextNode = document.createTextNode(styleText);styleNode = document.createElement(\"style\");styleNode.appendChild(styleTextNode);document.getElementsByTagName(\"head\")[0].appendChild(styleNode);};";
webBrowser.InvokeScript("eval", szfn);
}
See a description on the text size adjust property and this post on MSDN.

Cancel touches events on Windows Phone

I have a list on images in a Pivot control. If you touch an image, it navigates to another view. If if flick through a new pivot and touch the image meanwhile, it navigates.
I noticed the Facebook app or the native photo albums don't have this bug.
Any idea ?
edit: the code :
Image img = new Image();
Delay.LowProfileImageLoader.SetUriSource(img, new Uri(adViewModel.Photos[k].ThbUrl));
img.Width = 150;
img.Tag = k;
img.Height = 150;
img.MouseLeftButtonDown += new MouseButtonEventHandler(launch_Diapo);
Grid.SetRow(img, i);
Grid.SetColumn(img, j);
PhotosGrid.Children.Add(img);
If you can show your code we can probably provide a more specific answer.
However:
I'm guessing you're using MouseButtonLeftDown or similar to detect the touching of the image. Rather than this, use the Tap gesture from the toolkit. This should prevent the issue you're having.
There is a possible alternative to disable the pivot gesture while you're touching the image, but depending on how you're using the image within the pivotItem this may end up preventing proper pivot navigation.
You can add the Tap event in code like this:
var gl = GestureService.GetGestureListener(img);
gl.Tap += new EventHandler<GestureEventArgs>(gl_Tap);
and the handler would be something like this. (but actually doing something useful-obviously.)
void gl_Tap(object sender, GestureEventArgs e)
{
MessageBox.Show("tapped");
}
Even I had a similar problem . What i did is ,check for MouseButtonLeftDown position and MouseButtonLeftUp position .If they are Equal navigate else do nothing .I will paste the code below.
Point temp;
void img_MouseLeftButtonDown(object sender, MouseButtonEventArgs e)
{
temp = e.GetPosition(null);
}
void img_MouseLeftButtonUp(object sender, MouseButtonEventArgs e)
{
Point point = e.GetPosition(null);
if (point == temp)
{
this.NavigationService.Navigate(new Uri(...));
}
}

Resources