Windows Phone ScrollViewer.ScrollToVerticalOffset - scrollviewer

WinPhone 7.1
In a ScrollViewer I have a stack panel with about 500 strings. I want to scroll the stack panel from code to a certain offset. I tried this:
for (int i = 0; i < 500; i++)
{
tb = new TextBlock();
tb.Text = "String #" + i.ToString();
this.stackPanel1.Children.Add(tb);
}
this.scrollViewer1.ScrollToVerticalOffset(200);// scroll to offset 200
this.scrollViewer1.UpdateLayout();
but it wont scroll at all.
What am I doing wrong?
Thanks
donescamillo

This will solve your problem:
Dispatcher.BeginInvoke(() =>
{
scrollViewer1.UpdateLayout();
scrollViewer1.ScrollToVerticalOffset(200);
}
);

Related

Open app always in the center of the display - Windows 11 (WinUi 3)

I am develop a new app for Windows 11 with WinUi 3 and I want when I open the app always open in the center of my screen/display. It is possible?
I am using PInvoke.User32 for set window size (if it helps).
Thank you!
The following example code is simplistic but achieves what you are asking for.
Create a Windows App SDK project using the blank app template.
In the App.xaml.cs file, change the OnLaunched() method to the following:
m_window = new MainWindow();
var hWnd = WinRT.Interop.WindowNative.GetWindowHandle(m_window);
Microsoft.UI.WindowId windowId = Microsoft.UI.Win32Interop.GetWindowIdFromWindow(hWnd);
Microsoft.UI.Windowing.AppWindow appWindow = Microsoft.UI.Windowing.AppWindow.GetFromWindowId(windowId);
if (appWindow is not null)
{
Microsoft.UI.Windowing.DisplayArea displayArea = Microsoft.UI.Windowing.DisplayArea.GetFromWindowId(windowId, Microsoft.UI.Windowing.DisplayAreaFallback.Nearest);
if (displayArea is not null)
{
var CenteredPosition = appWindow.Position;
CenteredPosition.X = ((displayArea.WorkArea.Width - appWindow.Size.Width) / 2);
CenteredPosition.Y = ((displayArea.WorkArea.Height - appWindow.Size.Height) / 2);
appWindow.Move(CenteredPosition);
}
}
m_window.Activate();
When you run the app, its main window will be centered in the display.
Works Great!!!
i just copy paste your funcion under a general file and call it from every screen
public MYWindowClass
{
this.InitializeComponent();
var hWnd = WinRT.Interop.WindowNative.GetWindowHandle(this);
FuncionesGenerales.CenterToScreen(hWnd);
}
Then in my general file
FuncionesGenerales.CenterToScreen(IntPtr hWnd)
{
Microsoft.UI.WindowId windowId = Microsoft.UI.Win32Interop.GetWindowIdFromWindow(hWnd);
Microsoft.UI.Windowing.AppWindow appWindow = Microsoft.UI.Windowing.AppWindow.GetFromWindowId(windowId);
if (appWindow is not null)
{
Microsoft.UI.Windowing.DisplayArea displayArea = Microsoft.UI.Windowing.DisplayArea.GetFromWindowId(windowId, Microsoft.UI.Windowing.DisplayAreaFallback.Nearest);
if (displayArea is not null)
{
var CenteredPosition = appWindow.Position;
CenteredPosition.X = ((displayArea.WorkArea.Width - appWindow.Size.Width) / 2);
CenteredPosition.Y = ((displayArea.WorkArea.Height - appWindow.Size.Height) / 2);
appWindow.Move(CenteredPosition);
}
}
}
Thank You

Vue.Js draw lines between components problem

I am using SVGs to draw lines between components that are related in my app. Currently I am grabbing those elements and getting their position info with document.getElementById() and then using getClientBoundingRect.
This generally works, but there is occasional render wonkiness.
Is there a better way to do this? Perhaps an already existing library that works with VueJs?
Changing the class puts a CSS filter on the shape because you have
.isSelected {
filter: brightness(50%);
}
Now the W3C Filter Effects spec says
The application of the ‘filter’ property to an element formatted with the CSS box model establishes a new stacking context the same way that CSS ‘opacity’ does, and all the element's descendants are rendered together as a group with the filter effect applied to the group as a whole.
So browsers are doing the correct thing per that specification. The new stacking context puts the shape in front of the line.
See also this wontfixed Chromium bug
The problem ended up being because of document.getElementById and z-order
I ended up changing my timer to get the element by ref, and iterate through the children of my component to find it.
Here is the code:
drawLines: function () {
let children = this.$children
let lines = this.lines
lines.splice(0, lines.length)
let scheduleContainer = this.$refs.scheduleContainer
let scheduleContainerRect = scheduleContainer.getBoundingClientRect();
for (let i = 0; i < children.length; i++) {
let child = children[i]
if (child.$props.assignment) {
if (child.$props.assignment.assignmentRequestId != "00000000-0000-0000-0000-000000000000") {
for (let ii = 0; ii < children.length; ii++) {
let child2 = children[ii]
if (child2.$props.assignmentRequest) {
if (child2.$props.assignmentRequest.id == child.$props.assignment.assignmentRequestId) {
let assignmentRect = child.$refs.theContainer.getBoundingClientRect()
let requestRect = child2.$refs.theContainer.getBoundingClientRect()
let x1 = ((assignmentRect.left - scheduleContainerRect.left) + 12.5) + 'px'
let y1 = ((assignmentRect.top - scheduleContainerRect.top) + 12.5) + 'px'
let x2 = ((requestRect.left - scheduleContainerRect.left) + 12.5) + 'px'
let y2 = ((requestRect.top - scheduleContainerRect.top) + 12.5) + 'px'
let line = { 'x1': x1, 'y1': y1, 'x2': x2, 'y2': y2 }
lines.push(line)
}
}
}
}
}
}
},

PhantomJS PDF page break

I create a PDF report with header generated automatically by phantomjs. In the report I have a long div which contains text, blank lines, simple data tables etc.
Since I believe phantomjs might have problem with the page break, I calculate the page break manually, break up the long div into multiple divs with page break at the end of each div.
Here is my calculation in the jQuery(document).ready()
//pagination the Notes pages
if (encData.pnotes && encData.pnotes.length > 0) {
pageCnt++;
var $notes = jQuery('<div id="pageNotes" class="notes" style="width:100%;margin-top:100px;border:1px solid red">' +
pNotesString + '</div>');
$body.append($notes);
var height = 0;
var children = $notes.children();
var p = children.slice(0);
var pages = [];
var counter = 0;
for (var i = 0; i < children.length; i++) {
if (height + children[i].offsetHeight < 1350)
height += children[i].offsetHeight;
else {
pages.push([counter, i]);
height = 0;
counter = i;
}
}
pages.push([counter, children.length]);
for (var i = 0; i < pages.length; i++) {
//first notes page
if (i == 0) {
$notes.children().slice(pages[i][1]).remove();
$notes.after('<div style="border:1px solid black;height:1px"></div><div id="pageNotesBreak" style="page-break-after:always"> </div>');
}
else {
pageCnt++;
var $new = jQuery('<div id="page' + pageCnt + '" class="notes" style="width:100%;margin-top:100px;border:1px solid blue"></div>');
$new.append(p.slice(pages[i][0], pages[i][1]));
$body.append($new);
$body.append('<div style="border:1px solid black;height:1px"></div><div id="pageBreak' + pageCnt + '" style="page-break-after:always"> </div>');
}
}
The "<div style='border:1px solid black;height:1px'>" is just a silly marker to find where my page breaks are on the PDF.
1350px in the estimated height of objects where the page break should be created when I traverse all the children of the long div.
In Chrome, I see that I have a total of 5 pages.
But when it is rendered in PDF, the number of pages goes up to 6 or 7 depending the size of the font, the line height, etc.
Here is the image of the pages
Does anyone know the cause of the problem? And how to solve it in general.

How do I make ABCPdf to automatically write to a new page when text requires more than 1 page?

I deal with dynamic input text, so the pages should be dynamically created. If page 1 is already full, it should write to a new page, so it means I can have page 2, page 3 and so on depending on the data processed.
Currently, my text is truncated. Only writes Page 1, the rest of data are not written.
My current code below:
//add page 1
theDoc.Page = theDoc.AddPage();
theDoc.AddImageHtml(html, true, 826, true);
//continue adding page if needed
while (theDoc.GetInfo(theID, "Truncated") == "1")
{
theDoc.Page = theDoc.AddPage();
theDoc.AddImageHtml(html, true, 826, true);
}
//save file
String pdfFilePath = WebConfigurationManager.AppSettings["pdfFilePath"];
Guid fileName = Guid.NewGuid();
pdfLink = pdfFilePath + fileName.ToString() + ".pdf";
theDoc.Save(pdfLink);
theDoc.Clear();
variable html contains all the data(webpage), I'm probably missing something in my while loop. Any help is appreciated! Thanks
Found it, Use Chainable and then Flatten()
theDoc.Page = theDoc.AddPage();
int theID;
theID = theDoc.AddImageUrl("http://www.yahoo.com/");
while (true) {
theDoc.FrameRect(); // add a black border
if (!theDoc.Chainable(theID))
break;
theDoc.Page = theDoc.AddPage();
theID = theDoc.AddImageToChain(theID);
}
for (int i = 1; i <= theDoc.PageCount; i++) {
theDoc.PageNumber = i;
theDoc.Flatten();
}

Flex 3 - Enable context menu for text object under a transparent PNG

Here is the situation. In my app I have an overlay layer that is composed of a transparent PNG. I have replaced the hitarea for the png with a 1x1 image using the following code:
[Bindable]
[Embed(source = "/assets/1x1image.png")]
private var onexonebitmapClass:Class;
private function loadCompleteHandler(event:Event):void
{
// Create the bitmap
var onexonebitmap:BitmapData = new onexonebitmapClass().bitmapData;
var bitmap:Bitmap;
bitmap = event.target.content as Bitmap;
bitmap.smoothing = true;
var _hitarea:Sprite = createHitArea(onexonebitmap, 1);
var rect:flash.geom.Rectangle = _box.toFlexRectangle(sprite.width, sprite.height);
var drawnBox:Sprite = new FlexSprite();
bitmap.width = rect.width;
bitmap.height = rect.height;
bitmap.x = -loader.width / 2;
bitmap.y = -loader.height / 2;
bitmap.alpha = _alpha;
_hitarea.alpha = 0;
drawnBox.x = rect.x + rect.width / 2;
drawnBox.y = rect.y + rect.height / 2;
// Add the bitmap as a child to the drawnBox
drawnBox.addChild(bitmap);
// Rotate the object.
drawnBox.rotation = _rotation;
// Add the drawnBox to the sprite
sprite.addChild(drawnBox);
// Set the hitarea to drawnBox
drawnBox.hitArea = _hitarea;
}
private function createHitArea(bitmapData:BitmapData, grainSize:uint = 1):Sprite
{
var _hitarea:Sprite = new Sprite();
_hitarea.graphics.beginFill(0x900000, 1.0);
for (var x:uint = 0; x < bitmapData.width; x += grainSize)
{
for (var y:uint = grainSize; y < bitmapData.height; y += grainSize)
{
if (x <= bitmapData.width && y <= bitmapData.height && bitmapData.getPixel(x, y) != 0)
{
_hitarea.graphics.drawRect(x, y, grainSize, grainSize);
}
}
}
_hitarea.graphics.endFill();
return _hitarea;
}
This is based off the work done here: Creating a hitarea for PNG Image with transparent (alpha) regions in Flex
Using the above code I am able to basically ignore the overlay layer for all mouse events (click, double click, move, etc.) However, I am unable to capture the right click (context menu) event for items that are beneath the overlay.
For instance I have a spell check component that checks the spelling on any textitem and like most other spell checkers if the word is incorrect or not in the dictionary underlines the word in red and if you right click on it would give you a list of suggestions in the contextmenu. This is working great when the text box is not under the overlay, but if the text box is under the overlay I get nothing back.
If anyone can give me some pointers on how to capture the right click event on a textItem that is under a transparent png that would be great.